当前位置： 移动技术网 > IT编程>网页制作>Html5 > VueCLi3 配置less变量

VueCLi3 配置less变量

2019年12月18日  | 移动技术网IT编程  | 我要评论

广西卫视大地飞歌,又名荥阳站长网,赖文峰简历

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. 没了，可以使用了，有疑问的可以在下方留言评论 眨眼

  .

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网