vue2.96引入全局less文件

安装

npm install sass-resources-loader --save-dev 
npm install less less-loader --save //如果安装了 就不用安装这个了!
cnpm install less less-loader --save




找到/build文件夹下面的utils.js 找到
less: generateLoaders('less') 修改成

less: generateLoaders('less').concat({
    loader: 'sass-resources-loader',
    options: {
      resources: path.resolve(__dirname, '../src/assets/css/1.less')//你的全局less文件
    }
}),

注意less文件里面不能引入别的less文件! 不然报错

如果引入多个less则:

less: generateLoaders('less').concat({
      loader: 'sass-resources-loader',
      options: {
        resources: [
          path.resolve(__dirname, '../src/assets/less/fz.less'),
          path.resolve(__dirname, '../src/assets/less/all.less')
        ] //这里是你要全局引入less文件
      }
    }),


注意:如果是使用vue-cli3构建的环境

1、引入loader

vue add style-resources-loader

2、配置vue.config.js


 // vue.config.js
const path = require("path");
module.exports = {
    pluginOptions: {
        "style-resources-loader": {
            preProcessor: "less",
            patterns: [path.resolve(__dirname, "less文件路径")]
        }
    }
};

 




相关内容

发表评论

验证码:
点击我更换图片

最新评论