Подтвердить что ты не робот

css-loader localIdentName: хэш необходим для уникальности?

Css-loader README предлагает установить для localIdentName значение

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

Нужен ли суффикс хеширования? Будет ли он по-прежнему уникальным?

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

Почему или почему нет?

Тот факт, что №3 является вариантом в этом обсуждении проблемы GitHub, приводит меня к мысли, что это может и не понадобиться.

Ответ 1

localIdentName используется вместе с параметрами modules:

{
  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

Таким образом, хэш не понадобится, если имя пути, имя и класс генерируют уникальные идентификаторы. Очень маловероятно, что хэш понадобится.

Ответ 2

Нужен ли суффикс хеширования?

да

Будет ли он по-прежнему уникальным?

Было бы да, и это было бы не так. зависит

Почему или почему нет?

Затем давайте посмотрим на документацию

Модули параметров запроса позволяют использовать спецификации модулей CSS. Это позволяет использовать CSS по умолчанию по умолчанию. (Вы можете отключить его с помощью: global (...) или: global для селекторов и/или правил.).

По умолчанию CSS экспортирует все имена классов в глобальную область выбора. Стили могут быть локально ограничены, чтобы избежать стилей с глобальным охватом.

Главная цель здесь:

Стили могут быть локально ограничены, чтобы избежать стилей с глобальным охватом.

Вы можете сделать этот шаблон '[path][name]__[local]', но вы нарушите основную цель для области.

Если у вас есть инфраструктура интерфейса проекта, например, angular или reactjs. например, angular с directive/component или reactjs с component, это основная цель использования css. С помощью модулей CSS вы можете написать обычный код CSS и убедиться, что он применим только к данному компоненту. И нам не нужно переоценивать имя или длинное имя для определенного имени класса, чтобы избежать перезаписывания css