打字稿导出与默认导出

Typescript在exportdefault export之间有什么区别。 在所有教程中,我都看到有人export他们的类,如果我在导出之前不添加default关键字,我不能编译我的代码。

另外,在官方的脚本文档中 ,我找不到任何默认导出关键字的跟踪。

 export class MyClass { collection = [1,2,3]; } 

不编译。 但:

 export default class MyClass { collection = [1,2,3]; } 

请问。

错误是: error TS1192: Module '"src/app/MyClass"' has no default export.

默认导出( export default

 // MyClass.ts -- using default export export default class MyClass { /* ... */ } 

主要区别在于,每个文件只能有一个默认导出,并且可以像这样导入它:

 import MyClass from "./MyClass"; 

你可以给它任何你喜欢的名字。 例如,这工作正常:

 import MyClassAlias from "./MyClass"; 

命名导出( export

 // MyClass.ts -- using named exports export class MyClass { /* ... */ } export class MyOtherClass { /* ... */ } 

当您使用命名导出时,可以为每个文件导出多个导出,并且需要导入括号中包围的导出:

 import {MyClass} from "./MyClass"; 

注意:添加大括号可以修正您在问题中描述的错误,并且大括号中指定的名称需要与导出的名称匹配。

或者说你的文件导出了多个类,那么你可以像这样导入:

 import {MyClass, MyOtherClass} from "./MyClass"; // use MyClass and MyOtherClass 

或者你可以在这个文件中给他们任何一个不同的名字:

 import {MyClass, MyOtherClass as MyOtherClassAlias} from "./MyClass"; // use MyClass and MyOtherClassAlias 

或者你可以导入使用* as导出的所有内容:

 import * as MyClasses from "./MyClass"; // use MyClasses.MyClass and MyClasses.MyOtherClass here 

使用哪个?

在ES6中,默认输出是简洁的,因为它们的用例更为常见 ; 然而,当我正在使用TypeScript的一个项目的内部代码的时候,我更喜欢几乎所有的时候都使用命名的输出,而不是默认的输出,因为它在代码重构方面效果很好。 例如,如果您默认导出类并重命名该类,则只会重命名该文件中的类,而不会重命名其他文件中的任何其他引用。 使用命名的输出,它将重命名该类以及所有其他文件中对该类的所有引用。

它也可以很好地与重新导出文件(明星出口export *其他文件)。 这个答案的“示例”部分显示了一个例子。

请注意,即使只有一个导出,我对使用命名导出的看法也与TypeScript手册相反 – 请参阅“红色标记”部分。 我相信这个build议只适用于当你创build一个供其他人使用的API,而且代码不在你的项目内部时。 在为用户deviseAPI时,我将使用默认导出,以便人们可以import myLibraryDefaultExport from "my-library-name"; 。 如果你不同意我这样做,我很乐意听你的推理。

那就说,find你喜欢的东西! 你可以同时使用一个,另一个或两个。

附加点

默认导出实际上是名称为default的命名导出,所以如果文件具有默认导出,那么也可以通过执行导入:

 import {default as MyClass} from "./MyClass"; 

并注意这些其他导入方式存在:

 import MyDefaultExportedClass, {Class1, Class2} from "./SomeFile"; import MyDefaultExportedClass, * as Classes from "./SomeFile"; import "./SomeFile"; // runs SomeFile.js without importing any exports