Question

从Java到TS，我省略了导入类型周围的{...}。

import DiscriminatorMappingData from './DiscriminatorMappingData';

而不是

import {DiscriminatorMappingData} from './DiscriminatorMappingData';

请参阅TypeScript - storing a class as a map value?。

我已阅读文档并且不太了解。我只是从中获取当我只需要文件中的一种类型时，我可以省略{} 但是，这会导致奇怪的错误，例如“未知名称”或意外类型不兼容。

那么，有什么区别，简单地说吧？

Answer 1

TypeScript规范中介绍了两个import声明之间的区别。从§11.3.2，Import Declarations：

表单的导入声明

import d from "mod";

完全等同于导入声明

import { default as d } from "mod";

因此，当您导入导出为模块的default实体的东西（带有export default声明时，您将省略大括号，其中包含每个模块只能有一个）。您在import声明中提供的名称将成为该导入实体的别名。

当导入任何其他内容时，即使它只是一个实体，您也需要提供大括号。

TypeScript手册的Default exports部分有几个例子。

Answer 2

default导入必须没有花括号。通过下面的计算器功能示例，很容易理解。

// Calculator.ts

export default function plus() { }    // Default export 

export function minus() { }           // Named export

export function multiply() { }        // Named export

默认导入：没有大括号

// CalculatorTest.ts

import plus from "./Calculator"

plus不应用花括号括起来，因为它是使用default关键字导出的。

命名导入：花括号

// CalculatorTest.ts

import plus, { minus, multiply } from "./Calculator"

minus和multiply应该在花括号内，因为它们仅使用export关键字导出。请注意，plus在花括号外面。

默认导入别名

如果您想要default导入的别名，则可以使用大括号或不使用大括号：

// CalculatorTest.ts

import { default as add, minus, multiply } from "./Calculator"

OR

// CalculatorTest.ts

import add, { minus, multiply} from './Calculator'

现在plus()函数变为add()。之所以可行，是因为每个模块只允许一个默认导出。

就是这样！希望有帮助。

Answer 3

这是destructruring格式的导入。基本上将我们要导入的所有实体分组from定义文件。

如果您熟悉其他编程语言，您可能熟悉解构概念。实际上destructuring以assignments的形式添加es6作为es6 modules的一部分。

导入重组支持最初是在this Github ticket中的TypeScript中建议的，但后来被归为this ticket下跟踪所有slice的。{/ p>

TypeScript - import ...和import {...}之间的区别（带花括号）

3 个答案:

默认导入：没有大括号

命名导入：花括号

默认导入别名