无法在 Visual Studio 代码中使用 TypeScript 设置 Angular 2

Question

我快疯了。我是 JavaScript 模块加载的新手，是 Angular 的新手，也是 TypeScript 的新手，我不知道为什么我的设置不起作用。请帮忙！

我关注了 Angular 2 网站上的 quickstart instructions 并获得了运行ning 应用程序。以下是关键文件

index.html

<html>
  <head> 
    <script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script>
    <script src="https://jspm.io/system@0.16.js"></script>
    <script src="js/angular2.dev.js"></script>
  </head>
  <body>
    <my-app></my-app>
    <script>System.import('./js/app');</script>
  </body>
</html>

js/app.js 是主要组件，一切正常，但速度很慢。我现在正试图让一切都在我的本地机器上工作，并使用 AMD (RequireJS) 加载模块。新索引的外观如下：

index.html（第二版）

<html>
  <head>
  <script data-main="js/launch" src="js/require.js"></script>
  </head>
  <body>
    <my-app></my-app>
  </body>
</html>

launch.js（与 app.js 和 require.js 在同一文件夹中）

define(["require", "exports", "angular2.dev", "app"],
  function (require, exports, angular2, app) {});

应用程序无法运行并且浏览器抛出以下错误：
1) Error: Script error for angular2/angular2. http://requirejs.org/docs/errors.html#scripterror
2) TypeError: es6Promise is undefined
我尝试将 es6-promise.js（来自 here）放入 js/ 文件夹并将 launch.js 更改为：

launch.js（第二版）

define(["require", "exports", "es6-promise", "angular2.dev", "app"],
  function (require, exports, es6Promise, angular2, app) {
});

...但我得到了相同的 2 个错误。我正在使用以下设置在 Visual Basic 代码中编译 TypeScript：

tsconfig.json

{
    "compilerOptions": {
        "target": "ES5",
        "module": "amd",
        "sourceMap": false,
        "removeComments": true,
        "noImplicitAny": false,
        "emitDecoratorMetadata":true,
        "outDir": "./js",
        "out": "app.js"
    },
    "files": [
        "ts/app.ts"
    ]
}

我错过了什么？为什么 es6Promise 没有定义？请帮助。

Answer 1

这是一个包含一些示例的完整入门项目。现场演示也是如此。 http://www.syntaxsuccess.com/viewarticle/angular-2.0-examples

希望这能帮助您入门。

Answer 2

那是行不通的。 Angular 2 加载缓慢，因为它需要运行时转译，因为它使用了 es6 特性。对于运行时蒸腾，您需要包含 traceur，它将为 es6-promise 提供 polyfill。

这就是为什么它不起作用，即使你已经构建时间用打字稿转译了你的app.ts。

另外 require.js 不知道如何自己加载 es6 模块你仍然需要 system.js 用于 es6 模块加载器 polyfill。

无法在 Visual Studio 代码中使用 TypeScript 设置 Angular 2

Unable to setup Angular 2 with TypeScript in Visual Studio Code

javascript

requirejs

typescript

angular