如何在CommonJS文件中导入或引入TypeScript模块？

你现在遇到的问题是JavaScript运行环境默认不识别TypeScript文件，直接导入肯定会出问题，我给你两个实用的解决思路：

方案一：提前编译TypeScript为JavaScript #

这是最通用的常规做法，先把TS代码转成JS再导入：

1. 先确保项目里装了TypeScript：

npm install typescript --save-dev

2. 在项目根目录创建tsconfig.json配置文件，示例配置可以参考这个：

{
  "compilerOptions": {
    "target": "ES6", // 根据你的项目需求调整JS目标版本
    "module": "ES6",
    "outDir": "./dist", // 编译后的JS文件会输出到这个目录
    "strict": true
  },
  "include": ["src/**/*.ts"] // 指定要编译的TS文件范围
}

3. 执行编译命令，把TS文件转成可被JS识别的格式：

npx tsc

编译完成后，你的message.ts会生成对应的dist/connectors/message.js文件。

4. 修改resolver.js里的导入路径，指向编译好的JS文件：

import { Message } from '../../dist/connectors/message';

const resolver = {
  Query: {
    sendMessage: (root, args, ctx) => {
      console.log(args, ctx);
      return Message.send('1', 'message');
    }
  }
};

export { resolver };

方案二：用工具实时处理TS+JS混合导入 #

如果不想每次修改TS都手动编译，可以用ts-node这类工具实时处理：

1. 安装必要的依赖：

npm install ts-node typescript --save-dev

2. 修改tsconfig.json，开启允许处理JS文件的设置：

{
  "compilerOptions": {
    "target": "ES6",
    "module": "ES6",
    "allowJs": true, // 让TS编译器能够处理JS文件
    "strict": true
  }
}

3. 用ts-node运行你的项目入口文件，它会自动处理TS和JS的混合导入：

npx ts-node your-entry-file.js

为什么直接导入不行？ #

说白了，Node.js或者浏览器这类JS运行环境只能识别.js、.mjs这类原生JS格式的文件，.ts是TypeScript的专属格式，必须经过编译转成JS才能被运行环境解析。

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