目的

在static/styles/variables.less中定义了一些全局样式变量，并且大多数页面、组件都使用到这些变量。为了不用在每一个需要使用到这些变量的文件都引入一次该less文件，需要进行全局引入，减少代码量和工作量。

实现步骤

1. 创建less文件。（本示例中，less路径为/static/styles/variables.less）
2. 项目根目录创建vue.config.js配置文件
3. 写入以下代码

let path = require('path');
let stylePath = path.resolve(__dirname, 'static/styles/variables.less'); // 根据自己实际less路径替换'static/styles/variables.less'这部分
module.exports = {
	css: {
		loaderOptions: {
			less: {
				globalVars: {
					"hack": `true; @import "${stylePath}"`
				}
			}
		}
	},
}

4. 重新运行项目