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开始 ...
随机推荐
- 使用FFmpeg让mp4转gif
配好环境之后,需要在开始菜单中打开命令提示符,然后进入到test.mp4的文件目录下执行命令.(直接在文件目录下打开cmd不能生效)ffmpeg -i test.mp4 -f gif test.gif
- jenkins 内置变量
Jenkins 有一些内置的变量可以使用.主要是: 邮件的配置变量,可以在发送邮件的时候使用. 环境变量 1. 邮件的配置变量 ${GIT_BRANCH} - build 的 Git 分支 ${FIL ...
- surface book2 添加自定义分辨率
surface book2 13.5英寸 是3:2的屏幕, 因为默认分辨率3000*2000实在是太高了,看字的时候眼睛有点吃不消 即使开启windows的自定义缩放也有点难受,加上windows ...
- HttpRunnerManager(一)--安装
1.相关地址 (1)中文文档介绍:https://cn.httprunner.org/ (2)相关安装包下载地址:链接:https://pan.baidu.com/s/13SP1mFsNKrLK0sn ...
- SparseLDA算法
2 SparseLDA算法 本章将介绍一种Gibbs Sampling算法的加速算法——SparseLDA [9],它主要利用LDA 模型的稀疏性,来达到加速以及节省内存的目的,是一种精确算法(没有近 ...
- django 数据库操作详解
Django配置使用mysql数据库 修改 settings.py 中的 DATABASES 注意:django框架不会自动帮我们生成mysql数据库,所以我们需要自己去创建. DATABASES ...
- 转载 STM32 使用Cubemx 建一个USB(HID)设备下位机,实现数据收发
STM32 使用Cubemx 建一个USB(HID)设备下位机,实现数据收发 本文转载自 https://www.cnblogs.com/xingboy/p/9913963.html 这里我主要说一 ...
- java:Review(J2ee)
1.oracle: 1.1 增:insert into 删:delete from 改:update tablename set 查:select * from 1.2 聚合函数 max,min,av ...
- LeetCode.1010-歌曲总长度可被60整除的对数
这是小川的第377次更新,第405篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第239题(顺位题号是1010).在歌曲列表中,第i首歌曲的持续时间为[i]秒. 返回其总 ...
- USACO刷题索引
序 在距离CSP2019还有41天的国庆备战中,考了一场画风非常奇特的六校联赛,然后被教练建议刷一下这个巩固代码实现能力,然后就来了||ヽ(* ̄▽ ̄*)ノミ|Ю. 这个网站还是挺好玩儿的吧,刚开始各种 ...