mangle-vars-hoist-skipped

A CSS variable mangleVars could not hoist to a component.

Message

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

no-lca

[csszyx] mangle-vars-hoist-skipped: `mangleVars` did not hoist `<name>`: its <usageCount> usages share no common JSX ancestor.
  note: each element that uses it keeps its own scoped variable, and every class is still emitted.
  docs: https://csszyx.com/e/mangle-vars-hoist-skipped

non-host-ancestor

[csszyx] mangle-vars-hoist-skipped: `mangleVars` did not hoist `<name>`: the common ancestor of its <usageCount> usages cannot take a `style` prop.
  note: each element that uses it keeps its own scoped variable, and every class is still emitted.
  docs: https://csszyx.com/e/mangle-vars-hoist-skipped

max-depth

[csszyx] mangle-vars-hoist-skipped: `mangleVars` did not hoist `<name>`: one of its <usageCount> usages sits more than <maxDepth> levels below their common ancestor.
  help: raise `production.mangleVarHoistMaxDepth` to hoist it.
  note: each element that uses it keeps its own scoped variable, and every class is still emitted.
  docs: https://csszyx.com/e/mangle-vars-hoist-skipped

Level

Default: info under recommended, info under atomic. Set it in csszyx.config: rules: { 'mangle-vars-hoist-skipped': 'warn' }.

Arguments

The values this diagnostic names.

NameType
namestring
usageCountnumber
reason'no-lca' | 'non-host-ancestor' | 'max-depth'
maxDepthnumberoptional