We are able to dynamic import chart.js from skypack if needed.

const mod = await import("https://cdn.skypack.dev/chart.js");

mod.Chart.register(...mod.registerables);

However we are unable to register a dynamically loaded plugin.

The only way we are able to use plugins is by loading these from a script tag.

We have created a codepen to play around with the chartjs module loaded either dynamically or through script tag.

https://codepen.io/dbauszus-glx/pen/NWgQNjj

This works if loaded to the global window object.

  var myChart = new window.Chart(
    document.getElementById("chart").getContext("2d"),
    {
      responsive: true,
      type: dataview.chart.type || "bar",
      plugins: [ChartDataLabels],

This doesn't work if the datalabel plugin is loaded as a module.

The chart works if the plugins are commented out from the chart configuration.

  const mod = await import("https://cdn.skypack.dev/chart.js");

  mod.Chart.register(...mod.registerables);

  const plugin = await import('https://cdn.skypack.dev/chartjs-plugin-datalabels')

  var myChart = new mod.Chart(
    document.getElementById("chart").getContext("2d"),
    {
      responsive: true,
      type: dataview.chart.type || "bar",
      plugins: [plugin.default],