Question

我有以下TypeScript类

export class Vehicule extends TrackableEntity {
  vehiculeId: number;
  constructor() {
    super();
    return super.proxify(this);
  }
}

我在tsconfig.json中的打字稿目标配置为es6：

"compilerOptions": {
    "module": "es2015",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es6",
}

在运行时，Chrome在此处运行失败，

ReferenceError: Cannot access 'Vehicule' before initialization
    at Module.Vehicule (https://localhost:44338/src-app-components-dispositifsDATI-dispositifsDATI-module.js:10559:100)
    at Module../src/app/domain/models/VehiculeGpsBoxInfo.ts (https://localhost:44338/src-app-components-dispositifsDATI-dispositifsDATI-module.js:11156:69)
    at __webpack_require__ (https://localhost:44338/runtime.js:84:30)
    at Module../src/app/domain/models/Vehicule.ts (https://localhost:44338/src-app-components-dispositifsDATI-dispositifsDATI-module.js:10571:78)
    at __webpack_require__ (https://localhost:44338/runtime.js:84:30)
    at Module../src/app/components/dispositifsDATI/mainDATI/listDATI/listDATI.component.ts (https://localhost:44338/src-app-components-dispositifsDATI-dispositifsDATI-module.js:6447:82)
    at __webpack_require__ (https://localhost:44338/runtime.js:84:30)
    at Module../src/app/components/dispositifsDATI/index.ts (https://localhost:44338/src-app-components-dispositifsDATI-dispositifsDATI-module.js:3053:95)
    at __webpack_require__ (https://localhost:44338/runtime.js:84:30)
    at Module../src/app/components/dispositifsDATI/dispositifsDATI.routes.ts (https://localhost:44338/src-app-components-dispositifsDATI-dispositifsDATI-module.js:2982:64)

我需要将es5更改为es6才能解决this other problem。

编辑： VehiculeGpsBoxInfo.ts文件正在导入Vehicule，如下所示：

import { Vehicule } from "./Vehicule";

编辑2：我可以说这可能与webpack有关，这是在生成的模块中导出/导入模块的方式。

编辑3：经过进一步研究，这似乎与上面显示的代码无关。提出了一个有关webpack and ES6的新问题。

Answer 1

请注意，也可能是由于在同一@Injectable文件中定义了两个公共.ts类引起的。

当我只是在本地对事物进行原型设计时（尤其是在将一项服务重构为多个服务时），我已经跳过了不止一次。

设置emitDecoratorMetadata: false确实可以解决这种情况；但是如果您急于要修复某些东西或不想在大型项目中摆弄tsconfig.json文件–知道您仅通过复制一个类就可以修复它很有用。进入新文件。

Answer 2

由于循环依赖，我遇到了此错误，例如

A注射了B
B注入了C
C注射了A

删除循环依赖项可以修复此错误。

Answer 3

您可能遇到了以下Angular问题：https://github.com/angular/angular-cli/issues/15077。

从该问题开始：

嗨，您有一个理由要使emitDecoratorMetadata为真吗？

此TypeScript选项在ES2015 +代码中具有基本的设计限制，在针对此类输出时最好避免使用。因此，这是TypeScript本身而不是Angular的问题。

Angular 8+不再需要该选项。以前也只需要JIT模式使用，通常仅在开发中使用。

解决方案是在tsconfig.json文件中设置"emitDecoratorMetadata": false。

旁注： 我必须说，鉴于Angular CLI的先前版本会自动添加emitDecoratorMetadata: true，因此我没有理由知道为什么开发人员应该知道emitDecoratorMetadata现在应该是false， Angular团队基本上说“这不是我们的问题”，并且没有采取行动就解决了这个问题，这是非常可怕的。通过添加一些更好的文档（如链接问题中的某人所指出的），可以很容易地“解决”这一问题。

Answer 4

这很有意义，您正在将本地对象（Vehicle）传递给构造函数return super.proxify(this);中的父类。

请记住，本地Vehicle实例尚未实例化（构造函数块尚未完成），因此在此期间您无法使用此对象，需要等待构造函数完成其工作。

Answer 5

在Angular 8中，将entryComponent声明为SharedModule中的空列表对我造成了此问题

entryComponent：[]

删除entryComponent后，一切正常

角：7.2.1 ES6类ReferenceError：初始化之前无法访问“ X”

5 个答案: