美文网首页
vue全局混入less

vue全局混入less

作者: 明月半倚深秋_f45e | 来源:发表于2018-08-10 10:51 被阅读0次

准备写一个全局的less,里面放这公用的less变量和方法
如果每个页面都去

@import  '../assets/css/common.less'

太繁琐了
于是找到一个方法
参考https://www.jianshu.com/p/ab9ab999344b

先安装依赖

npm install sass-resources-loader --save-dev

然后去build下的utils.js下找到 generateLoaders方法
在 less后面加上 .concat()代码 (如下)
如果你的是sass,或者stylus那就去对应的地方改

function generateLoaders(){
//上面省略很多
  return {
    css: generateLoaders(),
    postcss: generateLoaders(),
    less: generateLoaders('less').concat({
      loader: 'sass-resources-loader',
        options: {
          resources: path.resolve(__dirname, '../src/assets/css/common.less') //地址按照自己的更改
        }
    }),
    sass: generateLoaders('sass', { indentedSyntax: true }),
    scss: generateLoaders('sass'),
    stylus: generateLoaders('stylus'),
    styl: generateLoaders('stylus')
  }
}

再然后就是重新npm run dev了

相关文章

网友评论

      本文标题:vue全局混入less

      本文链接:https://www.haomeiwen.com/subject/cflkbftx.html