使用带有 sass 的 react-css-modules 不起作用答案

【问题标题】：Using react-css-modules with sass not working使用带有 sass 的 react-css-modules 不起作用
【发布时间】：2016-10-05 11:39:15
【问题描述】：

我正在尝试让react-css-modules 在使用 sass 的同时工作，但就是无法正常工作。我正在关注文档，此时它应该可以正常工作。

Scss 包含在 jsx 中

import home from "../../scss/pages/_home.scss"

export default React.createClass({

    render() {
        return <app-content styleName={home.home}>
              }
         />
        </app-content>;
    }
})

webpack.config.js

        {test: /\.scss$/, loaders: [
            'style?sourceMap',
            'css?sourceMap&modules&importLoaders=1&localIdentName=[path]___[name]__[local]___[hash:base64:5]',
            'resolve-url',
            'sass?sourceMap']},
        { test: /\.css$/, loader: "style-loader!css-loader?sourceMap&modules" },

当然没有 js 错误，编译后以下内容会输出到我的元素：

<app-content stylename="src-client-scss-pages-____home__home___JTSxY"></app-content>

但是根本没有任何样式。

【问题讨论】：

标签： javascript css sass webpack react-css-modules

【解决方案1】：

呃……

好的，我考虑过删除这个问题，但我想如果它可以节省有人浪费 2 个小时来完成如此愚蠢的简单事情，为什么不发布答案：

    return <app-content class={home.home}>

从带有样式的元素上的styleName 更改为直观而明显的答案：class。

祝大家好运！

【讨论】：