webpack在less的文件中使用resovle

Question

1、在less文件中像js文件一样，引用短路径。2、webpack.config.js如下
resolve:{
extensions:['.js','.json'],
alias:{
src:path.resolve(__dirname,'src'),
components:'src/components',
routes:'src/routes',
common:'src/common'
}
},
3、js文件中可以直接使用import'components/Header.js'引用，但是less中无法使用@import'common/consts.less'

Answer 1

这个因为@import是由css-loader来解析的第一种方法@import‘~@scss/icon.less‘;，css引入中：@import"~@/style/theme"css属性中：background:url("~@/assets/xxx.jpg")html标签中：

Answer 2

//可通过CommonJS规范导入LESS模块require('./common/consts.less');既然使用了webpack,那就直接在js文件中引入就可以了，记得安装对应的loader