מודולי ES6 - האם TypeScript יכול לייבא תלויות גם מ-ESM וגם מ-CJS?

אני כותב יישום TypeScript שמשתמש בתלויות מותקנות עם NPM:

• חלק מהתלויות האלה מייצאות דרך CJS
• חלק מהתלויות האלה מייצאות דרך ESM

האם יש קובץ קונפיגורציה tsconfig.json שיאפשר לי להשתמש בכל התלויות האלה בצורה שקופה?

תשובה #1

כן, זה יכול!

לדוגמה, זהו פרויקט ES Module חדש עם תלות ESM (chalk) ותלות common.js (aes-js):

package.json:

{
  "type": "module",
  "private": true,
  "scripts": {
    "build": "tsc",
    "start": "yarn build && node dist/index.js"
  },
  "license": "ISC",
  "devDependencies": {
    "@types/aes-js": "^3.1.1",
    "typescript": "^4.8.4"
  },
  "dependencies": {
    "aes-js": "^3.1.2",
    "chalk": "^5.1.2"
  }
}

index.ts:

import chalk from "chalk"
import aesjs from "aes-js"

console.log(chalk.blue(aesjs.utils.utf8.toBytes("this is a string")))

tsconfig.json

{
  "compilerOptions": {
    "target": "es2022",
    "module": "es2022",
    "esModuleInterop": true,
    "moduleResolution": "node",
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "skipLibCheck": true,
    "outDir": "dist"
  }
}

הסבר: esModuleInterop הוא החבר שלך. זה מוודא ש-module.exports = יהפוך לייצוא ברירת מחדל (CommonJS -> ES6) ולהפך, ומוודא שייצואי ברירת המחדל זהים ל-module.exports = (ES6 -> CommonJS)