TypeScript从ES5与ES6编写的库中导入

Question

在运行依赖于外部库的转换后的 TypeScript代码时,我会遇到奇怪的错误

如 Uncaught TypeError: es5_lib_1.default is not a function

怎么了？

Answer 1

ES6模块规范与CommonJs略有不同,在此描述.这引入了一些在TypeScript中有点恼怒的兼容性问题.

TypeScript尝试import/require根据两个输入猜测转换语句的正确方法

• 该module物业tsconfig.json
• 如何将export语句写入相应的.d.ts文件中

在tsconfig.json文件中,我们可以设置转换后的输出将使用的模块格式.例如,module: 'es6'

我们在这里选择的内容会影响TypeScript允许的导入语法类型.这也受到相应.d.ts形状文件编写方式的影响.

如果我们从 CommonJS库导入而我们的输出模块以CommonJS为目标,我们必须使用

//tsconfig.json
module: "commonjs"

//.d.ts
declare module 'foo' {
    exports = Foo;
}

// App.ts
import Foo = require('foo');

如果我们从 CommonJS库导入而我们的输出模块以ES6为目标,我们必须使用:

//tsconfig.json
module: "es6"

//.d.ts
declare module 'foo' {
    exports default Foo;
}

// App.ts
import {default as Foo} from 'foo';

如果我们要从ES6库导入,import {default ... }无论目标输出模块格式如何,我们都可以使用该样式

//tsconfig.json
module: "es6|commonjs"

//.d.ts
declare module 'foo.es6' {
    exports default FooES6;
}

// App.ts
import {default as FooES6} from 'foo.es6';

这对.d.ts我们检索的文件意味着什么tsd install？

根据我们定位的输出,我们可能必须.d.ts在安装文件后更改文件以满足我们的需求.大多数.d.ts文件是为commonjs模块编写的,因此将使用该export = <lib>样式.但是如果你想要定位ES6输出,你需要编辑它并将其更改为export default

请根据需要提供对此答案的更正