我正在尝试配置vue-loader以使其在 @import
语句中包含node_modules . scss文件的加载器配置工作正常,如下所示:
{
test: /\.(sass|scss)$/,
use: [
'style-loader',
'css-loader',
{
loader: 'sass-loader',
options: {
includePaths: [path.resolve(__dirname, 'node_modules')],
},
},
],
},
所以现在我正试图在.vue文件中使用它 . 我想到了这样的事情:
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
// ?{"includePaths":["C:/Users/samuel/Code/school/tinf/sem03/proj01/node_modules"]}
sass: 'vue-style-loader!css-loader!sass-loader?' +
`includePaths[]=${path.resolve(__dirname, 'node_modules').replace(/\\/g, '/')}`,
},
},
},
我收到一条错误消息:
错误在./~/css-loader!./~/vue-loader/lib/style-rewriter.js?id=data-v-1ec85c08!./~/sass-loader?includePaths[]=C:/用户/萨穆埃尔/代码/学校/ TINF / sem03 / proj01 / node_modules!./〜/ VUE装载机/ lib目录/ selector.js?类型=样式与指数= 0!./ SRC /组件/ PageHeader.vue
我已经尝试从堆栈中删除 vue-style-loader
和 css-loader
,但仍然出现错误 .
但是当我直接将选项传递给样式标记时,它可以正常工作:
<style lang="sass?{"includePaths":["C:/Users/samuel/Code/school/tinf/sem03/proj01/node_modules"]}">
如何修改加载器以使其工作?
3 回答
您可以将其作为
includePaths
传递,如下所示sass option:糟糕!
给定的代码工作正常 .
我收到错误
File to import not found or unreadable: @material/typography
因为该文件不存在 . 我应该导入@material/typography/mdc-typography
.那是一个愚蠢的问题,我很抱歉 .
无论如何,这是我的固定webpack配置:
https://vue-loader.vuejs.org/en/options.html#loaders