vue-cli3使用sass全局变量（less同理）

Posted 2022-11-30 嘿起屁儿整

vue-cli2 与vue-cli3

vue-cli2 构建的项目有build文件夹来重头配置webpack（需要配置loader等）
vue-cli3 构建的项目没有build文件夹，webpack基本配置好了，只需要添加vue.config.js根据需要更改配置文件

vue-cli3使用sass全局变量

在vue.config.js中

注释：~@/这里默认代表 src下的相对目录
module.exports = 
	 css: 
    loaderOptions: 
      sass: 
        prependData: `@import "~@/views/common/css/globalcolor.scss";`//这里的scss文件根据自己的目录填写
      ,
      scss: 
        prependData: `@import "~@/views/common/css/globalcolor.scss";`
      ,
      //less同理
    
  ,


最后，直接在使用scss中定义的变量

附上官网解释