Discord.js+TypeScript项目部署Heroku报import语句错误怎么解决？

错误根因 #

• 首次抛出SyntaxError: Cannot use import statement outside a module错误，是因为你直接让Heroku运行了未编译的TypeScript源码，Node.js原生不支持直接运行TS，也默认不识别ESM规范的import语法。
• 手动编译为JS后仍报错，基本是三种情况：启动命令指向了TS源文件而非编译后的JS文件、tsconfig.json编译配置错误、package.json没有对应适配模块规范。

无需本地手动编译的自动部署方案（推荐） #

不需要每次本地跑tsc编译后再提交代码，配置后Heroku会在部署时自动完成编译工作：

1. 配置tsconfig.json #

在项目根目录创建/修改tsconfig.json，使用兼容Node.js的CommonJS输出格式，避免模块语法报错：

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "CommonJS",
    "outDir": "./dist", // 编译后的JS文件统一输出到dist目录
    "rootDir": "./src", // TS源码统一放在src目录下
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  }
}

如果你要使用ESM模块规范，需要把module字段改为ESNext，同时在package.json中添加"type": "module"字段。

2. 配置package.json #

修改package.json的脚本字段，指定构建和启动逻辑：

{
  "scripts": {
    "build": "tsc", // Heroku部署时会自动执行该命令完成TS编译
    "start": "node dist/index.js", // 启动命令指向编译后的入口JS文件
    "dev": "ts-node src/index.ts" // 本地开发调试用，可选配置
  },
  "dependencies": {
    "discord.js": "^14.0.0",
    "dotenv": "^16.0.0"
    // 其他生产依赖都放在该字段下，不要放在devDependencies
  },
  "devDependencies": {
    "typescript": "^5.0.0",
    "@types/node": "^18.0.0",
    "ts-node": "^10.0.0"
    // 开发依赖放在该字段下即可
  }
}

3. 配置Heroku环境变量 #

代码中使用的process.env.token需要在Heroku后台配置：进入你的应用页 -> 选择Settings标签 -> 找到Config Vars模块 -> 新增键为token，值为你的Discord机器人令牌，不要将密钥硬编码在代码中提交。

4. 配置.gitignore #

在.gitignore中添加/dist、node_modules，无需将本地编译的dist文件和依赖包提交到GitHub，Heroku会自动拉取依赖、执行构建命令生成产物。

本地手动编译的适配方案 #

如果你坚持本地手动执行tsc编译后再提交，只需做两个修改：

• 将package.json的start命令修改为你编译后JS文件的实际路径，比如编译后的index.js在根目录就写"start": "node index.js"
• 如果有Procfile配置文件，也要确保入口指向正确的JS文件，不要指向TS源文件。

内容的提问来源于stack exchange，提问作者TheoChow