vue-cli4.x 使用 scss 全局变量设置使用
2021-01-08 02:28
标签:log header ase 变量 ref 方案 net oat 解决方案 在网上也找了很多版本的方法,尝试后都不可行。由于我使用的是 vue-cli4.x 脚手架搭建的项目,在网上也找到一个解决方案,特此记录。 先在 package.json 文件中确定是否集成了 sass 相关的包 在安装完相关依赖后,需要在 在需要使用全局样式的地方,就可以进行使用 logo.vue 文件中使用。 原文地址:http://book.levy.net.cn/doc/frontend/vue/vue_scss_set.html vue-cli4.x 使用 scss 全局变量设置使用 标签:log header ase 变量 ref 方案 net oat 解决方案 原文地址:https://www.cnblogs.com/levywang/p/13532058.html
本记录仅针对于 vue-cli4.x 使用 scss 全局变量设置使用
确定依赖包
node-sass
和 sass-loader
. 若没集成,需要先进行相关安装。npm install node-sass
npm install sass-loader
相关配置
vue.config.js
中进行相关配置,重点配置路径。 路径后面的 ;
是必须的module.exports = {
css: {
loaderOptions: {
sass: {
prependData: `@import "./src/assets/styles/base";`,
},
},
},
}
使用
base.scss
文件中定义的样式。但是得注意在 加 lang="scss"
下一篇:JS将时间戳转化成年-月-日