问题描述: 定义了公共变量以及函数的
.less文件,在.vue文件中使用只能一个一个引入.文件少还好,如果几十个vue文件引用,一旦改变引用路径,就会变得很繁杂.
- 解决方法:
style-resources-loader, 也可以使用sass-resources-loader,但是定义变量得用另一种方式,所以我选择style-resources-loader,可以配置less-plugin-function自定义全局函数.
使用
安装
npm i -D style-resources-loader
配置
// webpack.config.js
...
{
loader: 'less-loader',
options: {
plugins: [ new LessFunc() ]
}
}, {
loader: 'style-resources-loader',
options: {
patterns: path.resolve(__dirname, './src/style/common.less')
}
}
在common.less中正常@import需要全局的less文件即可
