本文摘自PHP中文网,作者青灯夜游,侵删。
方法:首先安装【node-sass和sass-loader】依赖;然后打开【webpack.base.conf.js】文件,在rule中添加scss规则;最后在【<style></style>】标签内写scss样式。
本教程操作环境:windows7系统、Vue2.9.6版,该方法适用于所有品牌电脑。
在vue项目中使用scss
1.首先安装依赖
1 |
|
2.找到build
中webpack.base.conf.js
,在rules
中添加scss
规则
1 2 3 4 |
|
3.在vue文件中使用
1 2 |
|
在vue项目全局中引入scss
1.全局引用时需要安装sass-resources-loader
1 |
|
2.修改build
中的utils.js
将
1 |
|
修改为
1 2 3 4 5 6 7 8 9 |
|
相关推荐:
2020年前端vue面试题大汇总(附答案)
vue教程推荐:2020最新的5个vue.js视频教程精选
更多编程相关知识,请访问:编程入门!!
以上就是.vue文件里怎么写scss?的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
更多相关阅读请进入《vue》频道 >>
Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者