Webpack：在 html 中使用不同的组件特定 css 渲染？答案

【问题标题】：Webpack: Using Component specific css render different in html?Webpack：在 html 中使用不同的组件特定 css 渲染？
【发布时间】：2016-04-21 23:54:18
【问题描述】：

按照本教程，

https://github.com/christianalfoni/react-webpack-cookbook/wiki/Loading-CSS#component-specific

我试过实现这个逻辑，就是这样实现的。

这是它在网络上的呈现方式，

如您所见，导航栏类没有应用 css，因为类名呈现为 ".app-components-navbar-navbar-navbar-wrapper"。 但类名应该成为“导航栏包装器”

如何解决这个问题？
它应该是这样工作的吗？
如何实现组件特定的 css？

【问题讨论】：

标签： html css node.js webpack webpack-style-loader

【解决方案1】：

在 css 的加载器中，尝试将 localIdentName 的值从 [path][name]-[local] 更改为 [local]。 ident 名称基本上意味着它将按以下格式创建 css 类名。 ".app-components-navbar-navbar-navbar-wrapper" 表示 app/component/navbar 是定义它的地方，导航栏是文件名。 Local 表示您在 css 中的类名。

希望对你有帮助

【讨论】：