css加载程序localIdentName:唯一性是否需要哈希？

建议将

localIdentName

设置为

'[path][name]__[local]--[hash:base64:5]'

是否需要散列后缀？它还会像这样独一无二吗

'[path][name]__[local]'

为什么

---

事实上#3在这方面是一个选项，这让我相信它可能没有必要。

本地名称与

模块

选项一起使用：

{
  loader: 'css-loader',
  options: {
    modules: true,
    localIdentName: '[path][name]__[local]--[hash:base64:5]'
  }
}

它会生成较长的类名，如：

.src-styles-main__world-grid--R7u-K
 ---------------  ----------  -----
      path,name     local      hash

.src-styles-main__world-grid
 ---------------  ----------
      path,name     local

---

因此，只要路径、名称和类名生成唯一的ID，就不需要散列。不太可能需要散列。

是否需要散列后缀？

对

它还会像这样独一无二吗？

会是肯定的，也会是否定的，视情况而定

为什么？为什么不？

那就让我看看吧

查询参数模块启用CSS模块规范。 默认情况下，这将启用本地范围的CSS。（您可以使用 ：global（…）或：global用于选择器和/或规则。）

默认情况下，CSS将所有类名导出到全局选择器作用域中。 可以对样式进行局部范围限定，以避免全局范围限定样式

主要目的是：

可以对样式进行局部范围限定，以避免全局范围限定样式。

您可以使用此模式

'[path][name]\uuu[local]'

，但您破坏了范围的主要用途

如果您有像

angular

或

reactjs

这样的项目前端框架。例如

angular

带有

指令

/

组件

或

reactjs

带有

组件

，这是css的主要用途。使用CSS模块，您可以编写普通的CSS代码，并确保它只适用于给定的组件。我们不需要为特定的类名使用过多的名称或长名称来避免覆盖css

根据，默认情况下，哈希将是“相对路径和本地类名的摘要”，这使得它在第一个示例中看起来完全多余！

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/i,
        loader: 'css-loader',
        options: {
          modules: {
            localIdentName: '[path][name]__[local]--[hash:base64:5]',
          },
        },
      },
    ],
  },
};