不使用Node.js和npm，离线导入Chart.js遇默认导出错误求助

问题原因 #

你下载的chart.umd.min.js是UMD格式的文件，并非ES模块。而你使用的import语法是ES模块的导入方式，importmap也仅用于映射ES模块路径，UMD模块不会暴露ES模块规范的default导出，因此会触发报错。Three.js的three.module.js本身就是ES模块，所以能正常适配importmap和ES模块导入语法。

解决方案 #

方案1：改用Chart.js的ES模块版本 #

1. 下载对应4.3.0版本的ES模块文件（文件名通常为chart.esm.min.js），替换当前的chart.umd.min.js。
2. 保持原有的importmap配置和导入语句不变：

   <script type="importmap">
     {
       "imports": {
         "three": "./vendor/three.module.js",
         "gltf": "./vendor/GLTFLoader.js",
         "chart": "./vendor/chart.esm.min.js"
       }
     }
   </script>
   

   // chartComposit.js中正常导入
   import Chart from 'chart';
   

方案2：适配UMD模块的使用方式 #

如果坚持使用UMD版本，无需依赖importmap和ES模块导入：

1. 在HTML中直接用普通<script>标签引入UMD文件：

   <script src="./vendor/chart.umd.min.js"></script>
   

2. 在chartComposit.js中直接使用全局挂载的Chart对象，无需import语句：

   // 直接使用全局变量
   const myChart = new Chart(document.getElementById('myChart'), {
     // 图表配置项
   });
   

内容的提问来源于stack exchange，提问作者ádám homonnay