如何制作不需要在导入中添加".default"的 ESM / CJS 模块

Question

我可以设置我的包。对CJS和ESM使用不同的导入:

"main": "dist/cjs/index.js",
"module": "dist/esm/index.js",

我还可以设置我的TypeScript编译器来创建两个发行版:

// for ESM
{
"compilerOptions": {
"module": "es2020",
"target": "es2015",
"declaration": true,
"esModuleInterop": true,
"moduleResolution": "node",
"forceConsistentCasingInFileNames": true,
"outDir": "./dist/esm"
},
"include": [
"src/**/*"
]
}

// for CJS
"extends": "./tsconfig.json",
"compilerOptions": {
"module": "CommonJS",
"outDir": "./dist/cjs"
},

我可以使用tsc运行它们来生成一个包含cjs和esm文件夹的dist文件夹:

"build": "tsc -p tsconfig.json && tsc -p tsconfig-cjs.json"

然而，当我测试这个，我似乎需要添加.default到我的两个例子:

// CJS
const someClass = require('package').default
const instance = new someClass()
// ESM
import someClass from 'package'
const instance = new someClass.default("")

如何避免两个示例中所需的添加的.default?

我的包只导出一个类:

import someClass from './class';
export default someClass;

其中class也很简单:

class someClass { constructor() {} }
export default someClass

Answer 1

没有默认值的导出需要不同的语法:

class someClass { constructor() {} }
export = someClass

(要在TypeScript项目中导入这样的导出，你需要设置esModuleInterop标志。)