如何使用 Rollup 在 TypeScript 中声明 ES6 和 CommonJS 导出?

Aro*_*ron 6 commonjs typescript visual-studio-code es6-modules

TL;DR:如何让我的声明文件default在将其作为 ES6 模块导入时声明 MyModule 是导出,但module.exports在作为 commonjs 导入时声明它是对象?


我正在使用 Rollup 来捆绑我的模块,以便它可以作为 commonjs 和 ES6 模块导入。

// rollup.config.js
import ts from "rollup-plugin-typescript2";

export default {
  input: "src/index.ts",
  output: [
    {
      file: "dist/bundle.js",
      format: "cjs"
    },
    {
      file: "dist/bundle.es.js",
      format: "es"
    }
  ],
  plugins: [ts({ clean: true })]
};
Run Code Online (Sandbox Code Playgroud)

在我的 package.json 中:

 // package.json
 { ...
  "main": "dist/bundle.js",
  "module": "dist/bundle.es.js",
 ... }
Run Code Online (Sandbox Code Playgroud)

这是我的模块本身:

// src/index.ts
class MyModule {...}
export default MyModule;
Run Code Online (Sandbox Code Playgroud)

现在,我可以通过requireing 和importing成功导入这个模块:

// otherFile.js
import MyModule from 'MyModule'; // works as expected

const MyModule = require('MyModule'); // also works as expected
Run Code Online (Sandbox Code Playgroud)

然而,尽管导入我的模块的两种方式都按预期工作,但Intellisense仅适用import于 ES6 样式的模块。我认为这是因为声明文件只说了export default MyModule,所以 VS Code 认为 MyModule 类存在于require('MyModule').default,即使它实际上位于require('MyModule').

TL;DR:如何让我的声明文件在将其作为 ES6 模块导入时声明 MyModule 是默认导出,但module.exports在作为 commonjs 导入时它是对象?