vue-cli 安装sass 和 font-awesome 笔记
程序员文章站
2022-06-22 09:45:32
执行的命令都是在当前项目的根目录下执行 1、vue-cli 安装sass a、npm install style-loader css-loader sass-loader --save-dev //(--save-dev == -D) b、npm install node-sass --save- ......
执行的命令都是在当前项目的根目录下执行
1、vue-cli 安装sass
a、npm install style-loader css-loader sass-loader --save-dev //(--save-dev == -D)
b、npm install node-sass --save-dev //(sass-loader 依赖于node-sass)
c、npm install extract-text-webpack-plugin //(这个是webpack抽离css的插件,这个cli自带了,可以-v检查下)
d、在webpack.base.config.js 文件中
module:{
rule:[
{
test:/\.scss$/,
loaders:["style","css","sass"]
}
]
}
e、使用 在.vue文件<style lang="scss" type="text/css" scoped></style> 内部写scss ,scoped 组件class模块化
2、安装font-awesome
a、npm install font-awesome
b、main.js 文件中 import 'font-awesome/css/font-awesome.css'
c、使用 在需要的地方 <span class="fa fa-xxx"></span>
推荐阅读
-
前端笔记之Vue(一)初识SPA和Vue&webpack配置和vue安装&指令
-
Docker入门实践笔记(二)--安装和配置Tomcat镜像
-
Vue学习笔记进阶篇之vue-cli安装及介绍
-
vue安装和使用scss及sass与scss的区别详解
-
RVM安装和使用总结笔记
-
CI框架学习笔记(一) - 环境安装、基本术语和框架流程
-
vue安装插件node-sass和sass-loader,识别scss文件
-
其他笔记 - Mono for Windows 跨平台 Runtime 在Win10上编译和安装
-
nginx 学习笔记_nginx 安装和启动
-
Webpack4 学习笔记 - 01:webpack的安装和简单配置