chartjs/Chart.js · critical · Error

"${id}" is not a registered ${type}.

Error message

"${id}" is not a registered ${type}.

What it means

Registry._get(id, typedRegistry, type) looks up an item by id in the typed registry (scales, elements, controllers, plugins) and throws when the id is absent. It is called when resolving a component by id at render time, e.g. a dataset's `type`, a scale's `type`, or a plugin id in the config. The `type` in the message is the registry category (e.g. 'scale', 'controller', 'element').

Source

Thrown at src/core/core.registry.js:178

	 */
  _getRegistryForType(type) {
    for (let i = 0; i < this._typedRegistries.length; i++) {
      const reg = this._typedRegistries[i];
      if (reg.isForType(type)) {
        return reg;
      }
    }
    // plugins is the fallback registry
    return this.plugins;
  }

  /**
	 * @private
	 */
  _get(id, typedRegistry, type) {
    const item = typedRegistry.get(id);
    if (item === undefined) {
      throw new Error('"' + id + '" is not a registered ' + type + '.');
    }
    return item;
  }

}

// singleton instance
export default /* #__PURE__ */ new Registry();

View on GitHub (pinned to cb02e1d207)

Solutions

1. Switch to `import Chart from 'chart.js/auto'` to auto-register all bundled components.
2. Or explicitly register the missing component: `import { Chart, LineController, LinearScale, PointElement, LineElement } from 'chart.js'; Chart.register(LineController, LinearScale, PointElement, LineElement);`.
3. Verify the type string matches a registered id exactly (case-sensitive).
4. Check that registration side-effect imports are not dropped by the bundler (mark the module as having sideEffects, or import in the entry).

Example fix

// before
import { Chart } from 'chart.js';
new Chart(ctx, { type: 'line', data }); // 'line' controller not registered -> throws

// after
import { Chart, LineController, LinearScale, PointElement, LineElement, CategoryScale } from 'chart.js';
Chart.register(LineController, LinearScale, PointElement, LineElement, CategoryScale);
new Chart(ctx, { type: 'line', data });

// Verify a component id is registered before relying on it.
import { Chart } from 'chart.js';

function ensureRegistered(type, id) {
  // Chart.registry exposes get(id) for registered items per category
  try {
    const item = Chart.registry.get(id);
    if (!item) throw new Error(`'${id}' is not a registered ${type}.`);
    return item;
  } catch (e) {
    throw new Error(`Register '${id}' (${type}) before use. Use 'chart.js/auto' or Chart.register(...).`);
  }
}
ensureRegistered('scale', 'linear');
ensureRegistered('controller', 'line');

// Type helper to constrain type strings to a known registered set.
import type { ChartType, ScaleType } from 'chart.js';
function asKnownChartType(t: string): t is ChartType {
  return ['bar', 'line', 'scatter', 'bubble', 'pie', 'doughnut', 'polarArea', 'radar'].includes(t);
}

When it happens

Trigger: Using a chart type or dataset type whose controller is not registered (e.g. 'bubble' or 'scatter' under the bare 'chart.js' import that registers nothing); referencing scale type 'time' without registering TimeScale; listing a plugin id in options.plugins that was never registered; importing from 'chart.js' (manual) instead of 'chart.js/auto'.

Common situations: Bundle-size optimization via manual tree-shaken imports that omit a needed controller/scale/element; upgrading and a previously auto-registered component is no longer pulled in; typos in type strings ('lIne'); SSR builds where the registration side-effect import was stripped.

Related errors

• This method is not implemented: Check that a complete date a
• class does not have id: ${item}
• Cannot determine type of '${id}' axis. Please provide 'axis'
• Recursion detected: ${Array.from(_stack).join('->')}->${prop
• Unsupported decimation algorithm '${options.algorithm}'

AI-assisted analysis of chartjs/Chart.js@cb02e1d207 (2026-08-12). Data as JSON: /api/errors/b4a3af16fbcada7c. Report an issue: GitHub.