使用 YEOMAN 生成器的 Angular2 无法运行

Question

我已经开始学习 Angular2 并使用 YEOMAN 创建项目，它创建了所有必需的文件和一个简单的运行项目。

但是当我尝试在网络上使用 gulpserve 运行它时，它会抛出类似的错误

Potentially unhandled rejection [2] TypeError: Error loading "index" at http://localhost:8000/index.js
Cannot convert object to primitive value
    at http://localhost:8000/lib/system.js:1:4824
    at Array.<anonymous> (http://localhost:8000/lib/angular2.js:3888:7)
    at d (http://localhost:8000/lib/system.js:1:5501)
    at d (http://localhost:8000/lib/system.js:1:5364)
    at d (http://localhost:8000/lib/system.js:1:5364)
    at l (http://localhost:8000/lib/system.js:1:4590)
    at Object.$__global.upgradeSystemLoader.e.instantiate.Promise.all.then.execute (http://localhost:8000/lib/system.js:1:8278)
    at o (http://localhost:8000/lib/es6-module-loader.js:7:18496)
    at p (http://localhost:8000/lib/es6-module-loader.js:7:18868)
    at j (http://localhost:8000/lib/es6-module-loader.js:7:16406)

我对此错误一无所知。 谁能帮我解决这个问题，至少它可以运行。

我尝试过以下 5 分钟快速指南： https://angular.io/docs/js/latest/quickstart.html

Uncaught TypeError: angular2_1.Componant is not a function
[email protected]:140 Potentially unhandled rejection [2] Error loading "app" at http://localhost:8080/app.js
Error evaluating http://localhost:8080/app.js
Uncaught TypeError: angular2_1.Componant is not a function (WARNING: non-Error used)

Answer 1

您的 Angular 2 项目设置似乎存在一些问题。错误消息表明加载模块存在问题，并且可能不正确地使用 Angular 组件。以下是排查和解决这些问题的一些步骤：

检查您的 Angular 2 版本：确保您使用的 Angular 2 版本与您的设置兼容。您提到的指南可能适用于旧版本。

检查导入：确保正确导入 Angular 组件。例如， angular2_1.Componant 应该是 angular2_1.Component （注意 Component 的正确拼写）。

检查您的 SystemJS 配置：确保您的 SystemJS 配置（system.config.js 或类似）已正确设置以加载 Angular 2 和您的应用程序模块。

检查您的 Angular 组件定义：确保使用 @Component 装饰器正确定义您的 Angular 组件，并实现必要的属性和方法。

检查文件路径：仔细检查 index.html 中的文件路径和模块导入是否正确。

检查代码中的拼写错误和错误：有时，错误可能是简单的拼写错误或语法错误。仔细检查您的代码是否存在任何此类问题。

使用 Angular CLI：考虑使用 Angular CLI 来创建和管理 Angular 项目。它提供了一种更简化和标准化的方式来设置和运行 Angular 应用程序。

如果您可以提供有关项目设置的更多详细信息并分享一些相关的代码片段，我可以提供更具体的建议。