Skip to content

vue全局配置less

执行安装命令,安装所需要的模块

powershell
yarn add style-resources-loader

项目文件夹下创建或修改vue.config.js文件

javascript
const path = require('path')
module.exports = {
	chainWebpack: config => {
		const types = ['vue-modules', 'vue', 'normal-modules', 'normal']
		types.forEach(type => addStyleResource(config.module.rule('less').oneOf(type)))
	},
	css: {
		loaderOptions: {
			less: {
				javascriptEnabled: true
			}
		}
	}
}
function addStyleResource(rule) {
	rule.use('style-resource')
	.loader('style-resources-loader')
	.options({
		patterns: [
			// 需要全局导入的less路径,自己修改,可以引入多个less文件
			path.resolve(__dirname, './src/style/variables.less'),
		],
	})
}

重启项目即可

鄂ICP备19018246号-1