Node.js项目导入Chart.js遇语法错误：import调用参数异常

开发者阿泽

2026-8-8

解决Chart.js在Node.js+Express环境中的导入错误

核心问题分析

你遇到的错误来自两个关键点：

未将index.js声明为ES模块，浏览器无法识别import语法
导入路径与Express静态资源的映射规则不匹配

分步解决

1. 修正脚本的模块声明

浏览器默认把不带type="module"的脚本当作传统脚本，不支持ES模块语法。修改Pug中的脚本引入，移除冗余的chart.js引入，同时给index.js加上模块声明：

script(type="module" src="/scripts/index.js")

2. 调整导入路径匹配静态资源映射

你通过express.static将node_modules/chart.js/dist映射到了/scripts路径，因此auto.js的实际访问路径是/scripts/auto.js。修改index.js的导入语句：

import { Chart } from '/scripts/auto.js';

3. 适配不同Chart.js版本

如果使用的是Chart.js v3以下版本，dist目录中没有auto.js，需要手动导入核心库并注册图表类型（以柱状图为例）：

// 导入核心Chart类
import Chart from '/scripts/chart.js';
// 注册需要的图表类型及依赖组件
import { BarController, BarElement, CategoryScale, LinearScale } from '/scripts/charts/bar.js';
Chart.register(BarController, BarElement, CategoryScale, LinearScale);