第一种直接在main.js中引入，需要声明loader
demo：
import '!style-loader!css-loader!less-loader!./assets/css/common.less'
这样可以实现common.less样式的全局作用域，但是不能在局部vue文件中使用less中声明的变量
第二种使用style-resourses-loader这个loader，官网上也有说明，查了很多都是这种方法：
安装loader
npm install style-resources-loader -D
在vue.config.js中配置pluginOptions
如下：
// 第三方插件配置pluginOptions: {"style-resources-loader": {preProcessor: "less",patterns: [path.resolve(__dirname, "./src/assets/css/common.less")]}}
项目可以启动但是样式没有加载，里面的变量也不能使用，不知道怎么回事儿 3 配置css中的loaderOptions： 官方文档上只有sass的例子： demo
css:{loaderOptions:{sass:{//要处理的sass文件路径data:`@import "~@/assets/css/common.less";`}}
亲测可以，实现全局样式引入以及局部vue文件中可以使用sass文件中定义的变量； 参考文档/zh/guide/css.html#%E5%90%91%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8-loader-%E4%BC%A0%E9%80%92%E9%80%89%E9%A1%B9 如果是less文件，则只能定义全局变量，不能直接引入文件：
css:{loaderOptions:{less:{//全局变量名globalVars:{color1:'red';}}}}
亲测可以参考文档：/usage/#less-options
在sass less文件中定义元素的背景图路径问题：
background: url("~../assets/logo.png");
如果直接写在vue文件的style标签中，直接相对路径就可以，css文件中也是，less scss文件中需要在路径前面加上~，在img标签中引入本地的图片，也直接写相对路径就可以了；
在data中声明数据，有图片的本地路径，需要使用模块引入的方法：
require('../assets/logo.png')
