webpack:导入的样式是一个空对象

Question

这是我的webpack配置，但我试图导入scss样式，我在:export块声明，但我得到一个空的JSON。

不出所料，还有其他人有同样的问题:

https://github.com/webpack-contrib/sass-loader/issues/206

2. css modules object import返回空

config.webpack.js

{
test: /.(css|scss|sass)$/,
exclude: /node_modules/,
use: [
'style-loader',
{
loader: MiniCssExtractPlugin.loader,
},
'css-loader',
'resolve-url-loader',
'sass-loader',
{
loader: 'postcss-loader',
options: {
ident: 'postcss',
plugins: [require('autoprefixer')()],
},
},
],
}

感谢你的帮助或提示。

Answer 1

尝试将.module.放入您的scss文件名中。

。:filename.module.scss

然后在你的代码中:

import styles from "./filename.module.scss";

你可以使用你的scss的类:

<div className={styles.yourClassStyle}></div>