TypeScript：TypeError：App不是构造函数。

Question

我刚开始学习TypeScript，试图创建一个TypeScript类的实例，但是我没有成功。

以下是我的文件：

App.ts

import { EventEmitter } from 'events';

interface Emitter extends EventEmitter {

}
class App {
   constructor(protected app: Emitter){}
}

export default = App;

我正在使用tsc命令生成App.js文件，其源文件为App.ts。生成后的文件位于dist文件夹中。

我有另一个名为Test.js的文件。

在Test.js中，我导入了生成的App.js文件，并创建了一个实例，但是出现了以下错误：

TypeError: App不是构造函数

Test.js

const App = require("./dist/App);

module.exports = function(app){
    const appInstance = new App(app)
}

我不明白为什么会出现这样的错误，尽管在App.ts文件中有构造函数。

我在App.ts文件中做错了什么导致出现上述错误？

我该如何解决这个问题？

- Hemadri Dasari

---

接口和类不应该使用相同的名称声明吗？它们都被称为 App。您可以尝试将接口声明为 IApp。 - ConnorsFan

@ConnorsFan 抱歉，是我的错别字。我已经更新了我的问题。 - Hemadri Dasari

Answer 1

Typescript将export default = App;编译为一个具有属性default的对象的导出。

您可以使用以下两种方法解决这个问题：

1. 将js文件中的require更改为：const App = require("./dist/App).default;
2. 在tsconfig.json文件的compilerOptions中添加 allowSyntheticDefaultImports: false。

- felixmosh

---

太棒了，第一种选项解决了问题，但第二种没有起作用。你节省了很多时间。谢谢 :) - Hemadri Dasari

Answer 2

您使用了错误的方式导出应用程序，正确的方式如下导出：

export default class App {
   constructor(protected app: App){}
}

- Artyom Amiryan

---

但这仍然是有效的，对吧 class App{} export default App; 你能解释一下为什么在 TypeScript 中这是无效的吗？ - Hemadri Dasari

很抱歉，我已经尝试了你的解决方案，然而仍然无法避免出现那个错误。 - Hemadri Dasari

因为在 TypeScript 中没有类似的语法，所以无法将 export default 设置为等于某个值。相反，您应该在 class、variable、function 等之前添加 export default 来导出它。关于错误，您的 Test.js 文件位于哪里？我认为您写错了 App.js 的路径。 - Artyom Amiryan

Answer 3

在我的情况下，这是因为文件与类名相同。例如，在名为MyThing.ts的文件中定义了class MyThing {}。将文件重命名为mything.ts即可解决问题。希望这能帮助到某些人。

- Paul LeBeau

---

非常感谢。我昨晚和今天一直在尝试解决它，结果只是文件名的问题。 - Vinicius