Dogfalo/materialize · error · Error

noUiSlider: 'cssPrefix' must be a string or `false`.

Error message

noUiSlider: 'cssPrefix' must be a string or `false`.

What it means

The 'cssPrefix' option prepends a string to every CSS class noUiSlider generates, or when set to false disables prefixing entirely. The library rejects any other type (number, object, array, null) because string concatenation in testCssClasses would otherwise produce garbage class names.

Source

Thrown at extras/noUiSlider/nouislider.js:746

        }
    }

    function testFormat ( parsed, entry ) {

        parsed.format = entry;

        // Any object with a to and from method is supported.
        if ( typeof entry.to === 'function' && typeof entry.from === 'function' ) {
            return true;
        }

        throw new Error("noUiSlider: 'format' requires 'to' and 'from' methods.");
    }

    function testCssPrefix ( parsed, entry ) {

        if ( entry !== undefined && typeof entry !== 'string' && entry !== false ) {
            throw new Error("noUiSlider: 'cssPrefix' must be a string or `false`.");
        }

        parsed.cssPrefix = entry;
    }

    function testCssClasses ( parsed, entry ) {

        if ( entry !== undefined && typeof entry !== 'object' ) {
            throw new Error("noUiSlider: 'cssClasses' must be an object.");
        }

        if ( typeof parsed.cssPrefix === 'string' ) {
            parsed.cssClasses = {};

            for ( var key in entry ) {
                if ( !entry.hasOwnProperty(key) ) { continue; }

                parsed.cssClasses[key] = parsed.cssPrefix + entry[key];

View on GitHub (pinned to 824e78248b)

Solutions

  1. Pass a string prefix, e.g. cssPrefix: 'no-ui-'.
  2. To disable prefixing, pass cssPrefix: false (not 0 or null).
  3. Omit cssPrefix entirely to keep the default 'noUi-'.

Example fix

// before
noUiSlider.create(el, { start: 0, range:{min:0,max:100}, cssPrefix: null });
// after
noUiSlider.create(el, { start: 0, range:{min:0,max:100}, cssPrefix: false });
Defensive patterns

Strategy: type-guard

Validate before calling

function normalizeCssPrefix(opts) {
  const p = opts.cssPrefix;
  if (p === undefined || typeof p === 'string' || p === false) return p;
  throw new TypeError("cssPrefix must be a string or false");
}

Type guard

function isValidCssPrefix(v) {
  return v === undefined || typeof v === 'string' || v === false;
}

Prevention

When it happens

Trigger: Pass options.cssPrefix as a non-string, non-false, non-undefined value: a number (e.g. 0 to 'disable'), null, an object, or an array.

Common situations: Developers pass cssPrefix: 0 or null intending to disable prefixing (must be false), pass a numeric token, or reuse a config object where cssPrefix accidentally became another type.

Related errors


AI-assisted analysis of Dogfalo/materialize@824e78248b (2026-08-13). Data as JSON: /api/errors/6ce1a7b76a76da20. Report an issue: GitHub.