如何使用 css 模块设置 webpack答案

【问题标题】：How to set up webpack with css modules如何使用 css 模块设置 webpack
【发布时间】：2017-11-15 10:29:10
【问题描述】：

我正在尝试使用 css 模块配置我的 webpack，但它不起作用。

我的 webpack 是这样的：

module: {
 rules: [
   {
     test: /\.s?css$/,
     include: path.resolve(__dirname, './assets/css-master/'),
     loader: extractSass.extract({
       use: [
         // { loader: 'css-loader' },
         { loader: 'css-loader?modules&localIdentName=[name]__[local]___[hash:base64:5]' },
         { loader: 'sass-loader' },
       ],
       // use style-loader in development
       fallback: 'style-loader',
     }),
     exclude: /node_modules/,
   },
 ],
},

当我调用 className="test" 时，它会返回 css，但是当调用 className={cssImported.test} 时，它不起作用。

【问题讨论】：

标签： html css reactjs module webpack

【解决方案1】：

我通过卸载 react-css-modules 解决了这个问题，并更改了加载器。现在看起来像这样（只是从模块的's'中删除了's'）：{ loader: 'css-loader?module&localIdentName=[name]__[local]___[hash:base64:5]' },

【讨论】：