问答博客标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
php
java
vue.js
git
html5
python
node.js
android
mysql
react.js
linux
ios
css
golang
spring
docker
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

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

头像
klim
    4181894

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

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

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

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

    Microsoft前端typescriptjavascriptnode.jsnpm
    阅读 1k
    avatarAI BotBETA

    在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模块。

    1 个回答
    得票最新
    头像
    Undest
      2.4k2516

      可以看看报错信息说的是什么？理论上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写法的话就不会这种问题
      image.png

      查看全部 1 个回答
      推荐问题
      logo
      Microsoft
      子站问答
      访问
      宣传栏