嘿堆高车,
我正在使用 Rails 和 Webpacker 构建一个 React 应用,这迫使我使用PostCSS来加载样式以及其他可选样式顶部的装载机。
从我的import '@material/react-button/index';
之类的包中导入 SCSS 模块时, PostCSS 似乎并没有加载它们各自的依赖项,因为它需要@material/base/mixins
装载。
node_modules/@material/base/_mixins.scss
文件夹中存在文件node_modules
。因此,我真的不知道为什么它不会读取或导入相应的文件。
const { environment } = require('@rails/webpacker')
const path = require('path')
module: {
rules: [{
test: /\.js(\.erb)?$/,
exclude: /node_modules/,
loader: 'babel-loader',
options: {
presets: [
['env', { modules: false }]
]
}
},
{
test: /\.scss$/,
use: extractSCSS.extract({
use: [
{ loader: 'style-loader', options: { sourceMap: true } },
{ loader: 'css-loader',
options: {
sourceMap: true,
importLoaders: 2
}
},
{ loader: 'postcss-loader', options: { sourceMap: true } },
{ loader: 'sass-loader',
options: {
sourceMap: true,
includePaths: ["node_modules"]
}
}]
})
}]
}
module.exports = environment
10:53:42 webpacker.1 | ERROR in ./node_modules/css-loader??ref--2-1!./node_modules/postcss-loader/lib??ref--2-2!./node_modules/sass-loader/lib/loader.js??ref--2-3!./node_modules/@material/react-button/index.scss
10:53:42 webpacker.1 | Module build failed:
10:53:42 webpacker.1 | @import "@material/base/mixins";
10:53:42 webpacker.1 | ^
10:53:42 webpacker.1 | File to import not found or unreadable: @material/base/mixins.
10:53:42 webpacker.1 | in /Users/remy/projects/kmpgny-sked-rails/node_modules/@material/ripple/common.scss (line 17, column 1)
10:53:42 webpacker.1 | Error:
10:53:42 webpacker.1 | @import "@material/base/mixins";
10:53:42 webpacker.1 | ^
10:53:42 webpacker.1 | File to import not found or unreadable: @material/base/mixins.
10:53:42 webpacker.1 | in /Users/remy/projects/kmpgny-sked-rails/node_modules/@material/ripple/common.scss (line 17, column 1)
10:53:42 webpacker.1 | at options.error (/Users/remy/projects/kmpgny-sked-rails/node_modules/node-sass/lib/index.js:291:26)
10:53:42 webpacker.1 | @ ./node_modules/@material/react-button/index.scss 2:14-161 21:1-42:3 22:19-166
10:53:42 webpacker.1 | @ ./app/javascript/sked-app/components/App.jsx
10:53:42 webpacker.1 | @ multi (webpack)-dev-server/client?http://localhost:3035 webpack/hot/dev-server ./app/javascript/sked-app/components/App.jsx
10:53:42 webpacker.1 | webpack: Failed to compile.