vue项目css-loader配置alias无效

Question

看了css-loader文档于是想试一下https://www.webpackjs.com/loa...使用vue-cli3搭建的项目配置代码
css:{
loaderOptions:{
css:{
alias:{
'@css':path.join(__dirname,'src','css'),
}
},
}
},
项目中的使用
@import"@css/common.postcss";
.wrap{
padding:var(--common-space);
&.contain{
background:var(--common-background);
padding:var(--common-fill);
}
}
报错信息
errorin./src/views/job-management/report/completeness/index.vue?vue&type=style&index=0&id=464df02c&lang=postcss&scoped=true&
Modulebuildfailed(from../node_modules/postcss-loader/src/index.js):
Error:Failedtofind'@css/common.postcss'
in[
E:\数据资产项目\数据资产项目-前台\datamanagement\vue_project\data_quality\src\views\job-management\report\completeness
]
atresolveModule.catch.catch(E:\数据资产项目\数据资产项目-前台\datamanagement\vue_project\node_modules\postcss-import\lib\resolve-id.js:35:13)
at
跳过postcss-loader同样报错,不过报的错不一样了
报错信息
Thisdependencywasnotfound:
*-!../../../../../../node_modules/css-loader/index.js??ref--6-oneOf-1-1!../../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!./@css/test.cssin../node_modules/css-loader??ref--6-oneOf-1-1!../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../node_modules/cache-loader/dist/cjs.js??ref--0-0!../node_modules/vue-loader/lib??vue-loader-options!./src/views/job-management/report/completeness/index.vue?vue&type=style&index=0&lang=css&
Toinstallit,youcanrun:npminstall--save-!../../../../../../node_modules/css-loader/index.js??ref--6-oneOf-1-1!../../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!./@css/test.css

Answer 1

参照postcss-import文档解决了这个问题'postcss-import':{resolve:function(id){letalias={"@dq-common":path.join(__dirname,'data_quality','src','css','common.postcss')}returnalias[id]?alias[id]:id;}},

Answer 2

楼主可以试试下面的方法：module.exports={...configureWebpack:()=>({resolve:{alias:{'@css':path.join(__dirname,'src','css'),}},....})//用法如下//加破浪线~@import"~@css/test.css";