vue3 中 配置全局的less文件

1、如果你在创建项目的时候 选择了css预处理器 并且选择了less 那么项目创建成功之后 直接就按照了less 和less-loader

2、如果你在项目创建的时候没有选择css预处理器 那么就要单独安装

执行命令：

```

npm install less less-loader -D

```

二、再继续安装 style-resources-loader 和 vue-cli-plugin-style-resources-loader

```

npm i style-resources-loader -D

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

```

三、在vue.config.ts 添加如下代码

```

const { defineConfig } = require('@vue/cli-service')

const path = require("path");

module.exports = defineConfig({

transpileDependencies: true,

pluginOptions: {

'style-resources-loader': {

preProcessor: 'less',

patterns: [

// 这个是加上自己的路径,不能使用(如下:alias)中配置的别名路径

path.resolve(__dirname, './src/assets/styles/main.less')

]

}

}

})

./src/assets/styles/main.less 就是你全局的less 文件的路径

```

四、再运行项目 就可以了

```

npm run serve

```