mangle-hybrid-hazard

A production mangle that collides with, or breaks, CSS csszyx did not write.

Message

A name in angle brackets is a value the message fills in.

collision

[csszyx] mangle-hybrid-hazard: Mangling renamed classes to <count> token(s) that CSS outside csszyx also uses as class names, such as `<names>`, so the renamed elements pick up that CSS and the elements it was written for pick up the csszyx rules.
  help: rename those classes in your own CSS to something specific, such as `.x` to `.resize-handle-x`, and list the ones in a stylesheet you cannot edit in `production.mangleExclude`; until then, pass `production: { mangle: false }` to the csszyx plugin.
  note: `csszyx scan-collisions` lists every class name in your stylesheets that a token could take, as a `mangleExclude` list you can paste.
  docs: https://csszyx.com/e/mangle-hybrid-hazard

orphan

[csszyx] mangle-hybrid-hazard: Mangling renamed <count> class(es) that no stylesheet in this build has a rule for, such as `<names>`, so a stylesheet outside this build that styles them by name, such as one a separate Tailwind run writes, no longer matches them.
  help: build that stylesheet through this bundler, so csszyx renames its rules too; until then, pass `production: { mangle: false }` to the csszyx plugin.
  note: a class that no stylesheet styles had no CSS before the rename either, so it changes nothing.
  docs: https://csszyx.com/e/mangle-hybrid-hazard

selector-renamed

[csszyx] mangle-hybrid-hazard: Mangling broke <count> attribute selector(s) that match class names by text, such as `<selectors>`, so those rules stop matching and the elements lose those styles.
  help: keep those classes readable with `production.manglePreserve: [<entries>]`, or select on a data attribute, which mangling never changes.
  note: `production.mangleExclude` does not help here: it reserves token names and still lets the class be renamed.
  docs: https://csszyx.com/e/mangle-hybrid-hazard

selector-matched

[csszyx] mangle-hybrid-hazard: Mangling made <count> attribute selector(s) match the tokens it renamed classes to, such as `<selectors>`, so their rules style elements they were not written for.
  help: reserve those tokens with `production.mangleExclude: [<entries>]`, or select on a data attribute, which mangling never changes.
  note: a prefix or substring selector can match tokens a later build allocates too, so the data attribute is the lasting fix.
  docs: https://csszyx.com/e/mangle-hybrid-hazard

Arguments

The values this diagnostic names.

NameType
form'collision' | 'orphan' | 'selector-renamed' | 'selector-matched'
countnumber
namesstring[]optional
selectorsstring[]optional
entriesstring[]optional