javascript - 无法在 Visual Studio Code 中使用 TypeScript 设置 Angular 2

标签 javascript angular typescript requirejs

我快要疯了。我是 JavaScript 模块加载的新手,也是 Angular 的新手,也是 TypeScript 的新手,我不明白为什么我的设置不起作用。请帮忙!

我已关注quickstart instructions从 Angular 2 站点,并且已经能够获得正在运行的应用程序。以下是关键文件

index.html

<html>
  <head> 
    <script src="https://github.jspm.io/jmcriffey/<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="83e1ecf4e6f1aef7f1e2e0e6f6f1aef1f6edf7eaeee6c3b3adb3adbbb4" rel="noreferrer noopener nofollow">[email protected]</a>/traceur-runtime.js"></script>
    <script src="https://jspm.io/<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="e4979d97908189a4d4cad5d2ca8e97" rel="noreferrer noopener nofollow">[email protected]</a>"></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.jsrequire.js 位于同一文件夹中)

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

应用程序无法运行,浏览器抛出以下错误:
1) 错误:Angular2/Angular2 的脚本错误。 http://requirejs.org/docs/errors.html#scripterror
2) 类型错误:es6Promise 未定义
我尝试将 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 Code 中编译 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没有定义?请帮忙。

最佳答案

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

希望这能帮助您入门。

关于javascript - 无法在 Visual Studio Code 中使用 TypeScript 设置 Angular 2,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31329509/

相关文章:

html - 检测 Bootstrap 导航栏是否折叠或不成 Angular

Angular Material 复选框验证

javascript - 如何实现 es5 样式 "class"的 Typescript 接口(interface)?

javascript - 确定 JavaScript 语法在 ACE 的更改处理程序中是否有效

javascript - 使用 CSS 制作高度动画

angular - 当它由 router-outlet 创建时,如何将 css 类应用于组件元素?

node.js - Express 服务器添加 ssl

reactjs - 如何禁用更漂亮的断线

javascript - 如何在 ASP.Net 中检查客户端(JavaScript)的 Page.Validate()?

javascript - 如何定义变量并在 jsviews 模板上使用它?