vue-cli2配置全局less、sass变量

在build/utils中找到generateLoaders方法 在上面添加这两个方法,添加之前安装sass-resources-loader

npm i sass-resources-loader -D

然后添加这个两个方法就行了,下面展示less方法 ,如果是sass的话只需要将less-loader 改成sass-loader

function resolveResource(name) {
      return path.resolve(__dirname, '../src/assets/css/' + name);
  }
  function generateSassResourceLoader() {
      var loaders = [
        cssLoader, 
        // 'postcss-loader',
        'less-loader',
        {
            loader: 'sass-resources-loader',
            options: {
              // it need a absolute path
              resources: [resolveResource('basic.less')]
            }
        }
      ];
      if (options.extract) {
        return ExtractTextPlugin.extract({
          use: loaders,
          fallback: 'vue-style-loader'
        })
      } else {
        return ['vue-style-loader'].concat(loaders)
      }
  }

修改一下 less或sass的调用方法

// less
 less: generateSassResourceLoader()
//sass
 sass: generateSassResourceLoader()
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容