typescript 打字稿:从模块导入默认导出

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/43620356/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 04:29:01  来源:igfitidea点击:

typescript: import default export from module

typescriptimportexportdefault

提问by Cequiel

I have the following definition type file:

我有以下定义类型文件:

// index.d.ts
declare module 'Transformer' {
  class EditableElement {
      constructor(target: SVGPoint);
  }
  export = EditableElement;
}

And I want to import EditableElement. But when I write the following line:

我想导入EditableElement. 但是当我写下一行时:

import {EditableElement} from 'Transformer';

I get the next error:

我收到下一个错误:

Module "Transformer" resolves to a non-module entity and cannot be imported using this construct.

模块“转换器”解析为非模块实体,无法使用此构造导入。

How could I import the EditableElementclass? Actually, I just want to make use of that class. I don't want the importdirective to have a collateral effect in my code. I just want use it :'(

我怎么能导入这个EditableElement类?实际上,我只是想利用那个类。我不希望import指令在我的代码中产生附带影响。我只想用它:'(

回答by unional

This falls into ES6 / CommonJS interop.

这属于 ES6 / CommonJS 互操作。

My recommendation is to not relying on interop and use the old syntax instead:

我的建议是不要依赖互操作,而是使用旧语法:

const EditableElement = require('Transformer')

If you NEED to target es6/es2015, then you can do:

如果您需要针对 es6/es2015,那么您可以执行以下操作:

import * as EditableElement from 'Transformer'

// with `allowSyntheticDefaultImport`
import EditableElement from 'Transformer'

UPDATE: with [email protected] released, you can now do import EditableElement from 'Transformer'directly.

更新:随着 [email protected] 的发布,你现在可以import EditableElement from 'Transformer'直接做。

Turn on esModuleInteropin your tsconfig.json

打开esModuleInterop你的tsconfig.json

回答by Bogdan Surai

declare moduleis deprecated to use in your own typescript modules.You have to use either exportor export default.

declare module不推荐在您自己的打字稿模块中使用。您必须使用exportexport default

export class EditableElement {
      constructor(target: SVGPoint);
  }

For import you can use either import {EditableElement} from 'Transformer';or import * as EditableElement from 'Transformer';

对于导入,您可以使用import {EditableElement} from 'Transformer';import * as EditableElement from 'Transformer';

回答by Bogdan Surai

Do you have reference path like that?

你有这样的参考路径吗?

 /// <reference path="*/**/myModules.d.ts" />
 import * as m from "SomeModule";

回答by Dean Martin

I like to think of this in the following way.

我喜欢通过以下方式思考这一点。

Scenario 1 - Export / import explicit things (Not a default export. This results in the need for wrapping your import name with '{}').

场景 1 - 导出/导入显式内容(不是默认导出。这导致需要用“{}”包装导入名称)。

// Export (fileX)
export const something = 'hello world';

// Import (fileY)
import { something } from 'fileX';

Scenario 2 - Export / import a default (This results in no need for wrapping your import name with '{}'). The name that you choose, 'something' below, would be the alias for accessing your import.

场景 2 - 导出/导入默认值(这导致无需使用“{}”包装导入名称)。您选择的名称(下面的“某物”)将是访问您的导入的别名。

// Export (fileX)
export default 'hello world';

// Import (fileY)
import something from 'fileY';