Parcel build differs from localhost

Question

I'm developing a small webapp with parcel to display some charts. I'm using

• https://parceljs.org/
• https://www.chartjs.org/
• https://www.chartjs.org/chartjs-plugin-annotation/latest/

My app runs without any problems on localhost with "npm start". When deploying, there is an error "Chart is undefined".

Why is it different on dev (localhost) and production?

import { Chart } from 'chart.js/auto';
import annotationPlugin from 'chartjs-plugin-annotation';

(async function() {
    Chart.register(annotationPlugin); // Chart is undefined in production, on localhost it is working just fine
    ...

Got my code from the official documentation: https://www.chartjs.org/chartjs-plugin-annotation/latest/guide/integration.html

Answer 1

I found the solution, so for future reference, this is working:

import { Chart, DoughnutController, ArcElement } from 'chart.js';
import annotationPlugin from 'chartjs-plugin-annotation';

(async function() {
    Chart.register(DoughnutController, ArcElement, annotationPlugin);
    ...

So global import of all Charts.js "tools" and register a single plugin does not work.