vue样式中背景图片路径_vue-cli3.0全局less样式中该如何正确设置背景图片的路径？...

用vue-cli3脚手架新建的项目，在使用less设置背景图片的时候遇到了路径报错问题，该如何正确设置背景图片的路径？

项目目录如下：

现在在css文件中有一个全局样式common.less。使用的是images的一张图片icon.png。

common.less是通过vue.config.js里面全局这样引用的，如下代码：

pluginOptions: {

'style-resources-loader': {

preProcessor: 'less',

patterns: [path.resolve(__dirname, './src/assets/css/common.less')]

}

}

因为views中有一些.vue页面通用的样式，是写在common.less里的。所以现在想知道在common.less中该如何引用icon.png这张图片?

background: url(??????????/icon.png);

如果是直接写在.vue里的style样式，下面这样设置是没有问题的

background: url(../assets/images/icon.png);

或者data中通过require引入也是可以的。同样在通用的common.css如下使用也是没有问题的。

background: url(../../assets/images/icon.png);

但现在是common.less文件。那请问一下该如何引用？

不考虑使用cdn等绝对路径的情况或者不用less的情况。