style-resources-loader 配置全局less变量

确保已安装less、less-loader

npm i less

npm i less-loader


方法一:npm i style-resources-loader

npm i vue-cli-plugin-style-resources-loader

使用yarn的话:

方法二:直接使用vue add style-resources-loader安装

vue add pluginName 是vue-cli3提供的。vue add 是用yarn安装插件的, yarn源的问题有可能导致失败。如果安装失败的话,就采用方法一

在vue.config.js中使用:

const path = require('path');
module.exports = {
    pluginOptions: {
        'style-resources-loader': {
            preProcessor: 'less',
            patterns: [
                // 这个是加上自己的路径,不能使用(如下:alias)中配置的别名路径
                path.resolve(__dirname, 'src/assets/less/_variable.less')
            ]
        }
    },
    ……
    其他配置
    ……
}

 

sass方法等我应用了再记录,仅供参考

 
原文地址:https://www.cnblogs.com/yixiaoyang-/p/13365469.html