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的cli中引入css文件
在public文件中创建一个文件夹css,放进reset.css 在main.js中引入即可 import '../public/css/reset.css'就可以啦
- vue中引入字体文件
在用vue来写一官网的时候,想引入外部字体文件,毕竟总感觉他自己的字体有点难看,在这里记录下 1.先下载字体文件所需的.ttf文件 我这里想引入的是华文行楷字体 百度后下载了一个3M多的ttf文件 2 ...
- (转)webpack和webpack-simple区别(如何引入css文件)
博主最近研究vue+webpack的时候想引入css文件死活引入不出来,在webpack-simple那里却能引得出来,十分的纳闷,然后细心的调试了一下,原来这webpack和webpack-simp ...
- 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中引入字体图标报错,找不到字体文件
在用vue + webpack进行开发的时候,在引用字体图标遇到字体无法加载的问题: 报以下错误 搞了好久没搞定,最后才找到解决方法(还是没有找到原因) 修改字体图标的css中引入字体文件的路径 以前 ...
- vue引入swiper vue使用swiper vue脚手架使用swiper /引入js文件/引入css文件
vue引入swiper vue使用swiper vue脚手架使用swiper /引入js文件/引入css文件 ------------------------------------------- ...
- 『vue踩坑日常』 在index.html中引入静态文件不生效
Vue日常踩坑日常 -- 在index.html中引入静态文件不生效问题 本文针对的是Vue小白,不喜勿喷,谢谢 出现该问题的标志如下 控制台warning(Resource interpreted ...
- 【jsp】怎么在jsp文件中引入静态文件(.js .css)
如果在jsp文件中引入静态文件比如(.js或.css等等),可以在使用 /项目名称/路径 的方式,但是这种方式如果在修改了项目了名称后就显得比较麻烦了.除了之外还许多方式,比如相对路径等等.一般情况下 ...
随机推荐
- Java的两大数据类型
Java的两大数据类型 基本数据类型 byte,short,int,long,float,double,boolean,char byte 类别 内容 类型 byte 简介 byte 数据类型是8位. ...
- python 模块 - pymongo模块
mongoDB 数据库: pymongo 操作: import pymongo # 连接mongo数据库 client = pymongo.MongoClient(host='localhost', ...
- MySql cmd下的学习笔记 —— 有关视图的操作(algorithm)
建立一张简单的查询视图,不用临时表,只用条件合并 在简单的查询中,建立临时表的开销比较大 这是可以指定algorithm选项为merge 在v2的视图中,并没有建立临时表 但在下列情况下,必须建立临时 ...
- 论文笔记系列-iCaRL: Incremental Classifier and Representation Learning
导言 传统的神经网络都是基于固定的数据集进行训练学习的,一旦有新的,不同分布的数据进来,一般而言需要重新训练整个网络,这样费时费力,而且在实际应用场景中也不适用,所以增量学习应运而生. 增量学习主要旨 ...
- golang goroutine 介绍
Goroutine 是用户态自己实现的线程,调度方式遇到IO/阻塞点方式就会让出cpu时间(其实也看编译器的实现,如果TA在代码里面插入一些yield,也是可以的. 反正现在不是抢占式的.) 不能设置 ...
- ifconfig相关参数及用法说明
一.ifconfig ifconfig 主要是可以手动启动.观察与修改网络接口的相关参数,可以修改的参数很多,包括 IP 参数以及 MTU 等都可以修改,它的语法如下: [root@linux ~]# ...
- nginx指定文件路径有两种方式root和alias
背景 一直没明白这个配置啥意思,反正凑合用吧,不过老凑合总不是个事,没搞明白更容易忘,别人问还答不上来.反正也很简单,就搞明白点记下来. 知识点 root实例: location ^~ /t/ { r ...
- in exists
区别及应用场景 in 和 exists的区别: 如果子查询得出的结果集记录较少,主查询中的表较大且又有索引时应该用in, 反之如果外层的主查询记录较少,子查询中的表大,又有索引时使用exists.其实 ...
- svn:Item ‘XXXXXX’ is out of date
问题描述: 工作副本没有更新到最新版本 svn: 提交失败(细节如下): svn: 目录 "D:\develop\workspace\gxcjx\src\main\resources ...
- lanmp安装
下载安装(ssh登录服务器,执行如下操作即可,需要用到root用户权限来安装)源码编译安装wget http://dl.wdlinux.cn:5180/lanmp_laster.tar.gztar z ...