Question

遵循css-loader hashPrefix上的示例。

Webpack配置设置为

{
  test: /\.css$/,
  exclude: path.resolve(__dirname, 'node_modules'),
  use: [
    {
      loader: 'style-loader',
    },
    {
      loader: 'css-loader',
      options: {
        modules: true,
        hashPrefix: 'hash',
      }
    }
  ]
}

，输出的css键是

big: "app__big--iUuZi"
env: "app__env--3ylTw"
header: "app__header--3w1O7"

我期待着类似的东西

big: "hash_app__big--iUuZi"
env: "hash_app__env--3ylTw"
header: "hash_app__header--3w1O7"

有人可以澄清hashPrefix吗？

Answer 1

发件人：声明在这里的答案：https://cmty.app/nuxt/nuxt.js/issues/c9566

默认情况下， css-loader 根据Webpack请求生成哈希，例如：

genHash('components/G-TheThemeSwitcher.vue+TheThemeSwitcher__switch')，

hashPrefix 用于添加前缀（如盐）以生成更多唯一的哈希，例如：

genHash('my-hashcomponents/G-TheThemeSwitcher.vue+TheThemeSwitcher__switch')。

因此，指定哈希前缀将更改Webpack哈希功能的默认结果。结果（在localIdentName之后的数字和字母）将始终是乱码，但是，当您添加哈希前缀时，这将是自定义乱码。

Answer 2

hashPrefix用于添加前缀（例如盐），以生成更独特的哈希，例如

在这里找到：https://cmty.app/nuxt/nuxt.js/issues/c9566

css-loader选项中的hashPrefix应该如何工作？

2 个答案: