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
typescript: import default export from module
提问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 EditableElement
class? Actually, I just want to make use of that class. I don't want the import
directive 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 esModuleInterop
in your tsconfig.json
打开esModuleInterop
你的tsconfig.json
回答by Bogdan Surai
declare module
is deprecated to use in your own typescript modules.You have to use either export
or export default
.
declare module
不推荐在您自己的打字稿模块中使用。您必须使用export
或export 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';