Vue3中使用less、矢量图标

一、CSS预处理器的使用

1、下载插件

text npm install style-resources-loader --save npm install vue-cli-plugin-style-resources-loader --save

2、在根目录下创建vue.config.js

```javascript let path = require('path');

module.exports = { // 第三方插件配置(scss和它一样) pluginOptions: { 'style-resources-loader': { // less的话 这里改成less preProcessor: 'scss', //在assets(静态资源文件夹)下创建全局样式文件；index.less 它就是less全局变量 patterns: [path.resolve(__dirname, './src/styles/index.scss')] } } } ```

3、使用

```vue

```

二、vue项目中使用icon图标库

1、下载：

地址：https://www.iconfont.cn/

注：把下载的文件解压后放入assets——>icon(自己创建)文件夹里。

2、使用

```html

```