VueCLi3 配置less变量
程序员文章站
2022-07-04 22:40:27
Step1. 文档介绍 1 // vue-cli css预处理文档: https://cli.vuejs.org/zh/guide/css.html#自动化导入 2 // less文档: https://www.w3cschool.cn/less/less_variables_overview.ht ......
step1. 文档介绍
1 // vue-cli css预处理文档: https://cli.vuejs.org/zh/guide/css.html#自动化导入 2 // less文档: https://www.w3cschool.cn/less/less_variables_overview.html
step2. 安装
根据文档执行:(不要直接npm i 安装,用vue内置的add:)
1 vue add style-resources-loader
安装过程中,会询问安装哪个预处理器:(我用的是less)
step3. 手动添加需要引入的变量文件
步骤2完成之后,会在vue.config.js自动添加less的配置,当然变量文件是需要手动添加的
1 pluginoptions: { 2 'style-resources-loader': { 3 preprocessor: 'less', 4 patterns: [ 5 path.resolve(__dirname, './src/less/variables.less') // 变量文件位置 6 ] 7 } 8 },
step4. 没了,可以使用了,有疑问的可以在下方留言评论
.
上一篇: 苹果底部工具栏设置怎么透明(隐藏dock栏壁纸方法)
下一篇: C#设计模式学习笔记:(5)原型模式