javascript - 需要怎么配置才能在TypeScript中使用ESM方式引入nodejs的库？

Question

我看到ts代码有：如下的引用：

import * as fs from "fs";
import { promises as fsp } from "fs";

但是我下载repo本地会报错：

fs 应该是nodejs的库，一般我们知道是:require方式进行引入, 但是为何这里使用import引入也可以呢，是需要额外配置哪里才能使用ESM引入吗？

Answer 1

可以看看报错信息说的是什么？理论上ts是支持这样写的。试试看配置esModuleInterop 和 allowSyntheticDefaultImports
esModuleInterop 属性用于提供对 ES 模块的兼容性支持。当我们在 TypeScript 项目中引入 CommonJS 模块时，可以通过设置 esModuleInterop 为 true 来避免引入时的错误。

{
  "compilerOptions": {
    ...,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true
  }
}

来源是官网的兼容性说明:
https://www.typescriptlang.org/docs/handbook/modules/appendic...
中文版本:
https://ts.nodejs.cn/docs/handbook/modules/appendices/esm-cjs...
事实上这只是编译器对于这种写法的不兼容，如果你用原生的require写法的话就不会这种问题

Answer 2

在TypeScript中使用ESM（ECMAScript Modules）方式引入Node.js的库（如fs模块），通常需要在你的项目中做一些配置，以确保TypeScript编译器（tsc）和Node.js运行时都能正确处理ESM。以下是几个步骤和要点来帮助你配置：

1. 确保Node.js版本支持ESM

首先，确保你的Node.js版本支持ESM。从Node.js v12开始，ESM的支持逐步增加，但直到Node.js v14及更高版本，ESM的支持才变得更加完整和稳定。

2. 配置tsconfig.json

在你的tsconfig.json文件中，你需要设置几个关键的编译选项来支持ESM。主要是设置module选项为ESNext或ES2020（取决于你的具体需求），并确保target选项与你的Node.js版本兼容。同时，你可以设置esModuleInterop为true来允许默认导入非ESM模块。

{
  "compilerOptions": {
    "module": "ESNext",
    "target": "ES2018", // 根据你的Node.js版本调整
    "esModuleInterop": true,
    "moduleResolution": "node",
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "**/*.spec.ts"]
}

3. 在package.json中启用ESM

对于Node.js项目，你可以在package.json文件中添加一个"type": "module"字段，这样Node.js就会将.js文件作为ESM来处理。但是，由于你正在使用TypeScript，这主要影响.js文件的直接运行。对于.ts文件，TypeScript编译器的配置（如上所述）更为重要。

{
  "name": "your-project-name",
  "version": "1.0.0",
  "type": "module",
  "main": "dist/index.js",
  "scripts": {
    "build": "tsc"
  },
  "dependencies": {
    // 你的依赖
  },
  "devDependencies": {
    "typescript": "^4.x.x" // 确保是支持ESM的版本
  }
}

4. 编译TypeScript到ESM

使用上述tsconfig.json配置，TypeScript编译器（tsc）将默认编译.ts文件为.js文件，并保留ESM的import和export语句。然后，你可以直接在支持ESM的Node.js环境中运行这些编译后的.js文件。

5. 注意事项

• 确保你的所有依赖项都支持ESM，或者你已经找到了与你的项目兼容的替代方案。
• 在某些情况下，你可能需要使用.mjs扩展名来明确指定文件为ESM，但这在TypeScript项目中通常不是必需的。
• 调试和排错时，注意检查Node.js的错误消息，它们通常会提供关于为什么文件被视为CommonJS模块而不是ESM的线索。

按照这些步骤操作后，你应该能够在TypeScript项目中使用ESM方式引入Node.js的库，包括fs模块。