vue中如何引入css文件
两种方式引入css文件,一种是直接在main.js中引入(也可以在其他的.vue文件中的<script></script>标签中),即下面这种写法:
import 'element-ui/lib/theme-default/index.css'
这种写法适用于此css文件存在于项目中,不适用于通过网址访问的方式引入,会报错。偶试着引入Font Awesome,结果报错:
| 
 1 
 | 
import "http://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" | 
而直接在组件中引入却可以,组件中引入也比较简单:
<style>
@import "../css/style.css";
@import "//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css";
</style>
引入语句后面最好加上分号,只引用一个还好,引用多个不加分号会报错。
当然还有使用require()引入的,暂时比较习惯使用import。
vue中如何引入css文件的更多相关文章
- 如何在vue中全局引入stylus文件的公共变量
		
新建 一个公共的stylus公共文件添加公共变量,如下: 修改下图圈出的文件: 具体的修改如下: // generate loader string to be used with extract t ...
 - vue中引入css文件
		
两种方式引入css文件,一种是直接在main.js中引入(也可以在其他的.vue文件中的<script></script>标签中),即下面这种写法: import 'eleme ...
 - vue脚手架使用swiper /引入js文件/引入css文件
		
1.安装vue-cli 参考地址:https://github.com/vuejs/vue-cli 如果不使用严格语法需要在后三项打no:(加了挺头疼的,老是报错,但是对自己的代码规范性也是有很大的帮 ...
 - Vue在单独引入js文件中使用ElementUI的组件
		
Vue在单独引入js文件中使用ElementUI的组件 问题场景: 我想在vue中的js文件中使用elementUI中的组件,因为我在main.js中引入了element包和它的css,并挂载到了全局 ...
 - vue引入swiper  vue使用swiper  vue脚手架使用swiper /引入js文件/引入css文件
		
vue引入swiper vue使用swiper vue脚手架使用swiper /引入js文件/引入css文件 ------------------------------------------- ...
 - (转)webpack和webpack-simple区别(如何引入css文件)
		
博主最近研究vue+webpack的时候想引入css文件死活引入不出来,在webpack-simple那里却能引得出来,十分的纳闷,然后细心的调试了一下,原来这webpack和webpack-simp ...
 - vue中如何引入全局样式或方法
		
vue中我么会经常用到通用的一些全局的方法,如何左才能实现全局的复用减少代码累赘呢? 我们一般将公用的方法分装再utils.js文件中,然后再main.js主入口文件中将utils.js中的公共的方法 ...
 - html引入css文件
		
在HTML中,引入CSS的方法主要有行内式.内嵌式.导入式和链接式. 行内式:即在标记的style属性中设定CSS样式,这种方式本质上没有体现出CSS的优势,因此不推荐使用.例: <html&g ...
 - jquery,js引入css文件,js引入头尾
		
jquery,js引入css文件,js引入头尾 今天在项目中,需要把20多个页面加上头和尾部,头和尾是我写的,所以小师傅把这个工作交给我了. 我开始往里面加,先引入common.css,在body开始 ...
 
随机推荐
- P1533可怜的狗狗
			
困死了,完全做不下去题 就当是对莫队最最基本的思想的一个复习叭(只有最最基本的思想,没有莫队) 传送 我们可以很容易的想到这题要用线段树. 60pts 此题要求某个区间里第K小的数,可以暴力的考虑对每 ...
 - IMDB Classification on Keras
			
IMDB Classification on Keras In the book of Deep Learning with Python, there is an example of IMDB m ...
 - Python基本语法_函数属性 & 参数类型 & 偏函数的应用
			
目录 目录 前言 软件环境 Python Module的程序入口 函数的属性 Python函数的创建 函数的参数 必备参数 缺省参数 命名参数 不定长参数 匿名参数 偏函数的应用 前言 Python除 ...
 - SQLServer 断开指定会话
			
方法1: SELECT * FROM [Master].[dbo].[SYSPROCESSES] WHERE [DBID] IN ( SELECT [DBID] FROM [Master].[dbo] ...
 - iOS 开发】解决使用 CocoaPods 执行 pod install 时出现 - Use the `$(inherited)` flag ... 警告
			
公司项目在执行 pod install 的时候总是出现很多黄色的警告,因为是警告并不会影响项目的正常编译,一直没有在意,但是总是有很多警告看起来很不舒服,于是就花了点时间解决掉了,下面将解决方法记录下 ...
 - Java编程思想——标准 I / O
			
将Syetem.out转换成PrintWriter 标准I/O重定向: 控制台信息量大,滚动快,查看困难 setIn(InputStream) setOut(...) setErr(...) 新I/O ...
 - yum本地源和网络源的配置
			
一.yum本地源 1. 删除YUM库[root@tianyun ~]# rm -rf /etc/yum.repos.d/* 2.挂载安装光盘(临时):[root@tianyun ~]# m ...
 - linux是什么与如何学习(三)
			
1.1Linux是什么 Linux是在计算机上面运作的,所以说是一组软件. 1.2 Linux是什么?操作系统还是应用程序? 计算机主机是由一套硬件所组成的,为了有效的控制这些硬件资源,于是就有了操 ...
 - MySQL-4- 索引及执行计划
			
1. 索引作用 提供了类似于书中目录的作用,目的是为了优化查询 2. 索引的种类(算法) B树索引 Hash索引 R树 Full text GIS 3. B树 基于不同的查找算法分类介绍 B-tr ...
 - 小记---------手动执行脚本正常执行,使用crontab定时执行时 不执行
			
可能出现的原因就是因为crontab不会从用户的/etc/profile文件中读取环境变量,所以就出现 使用定时crontab执行时 无法执行 抛错 所以在使用crontab 定时执行脚本时 在脚本 ...