如何使用Angular 2编译Typescript?

时间:2015-11-06 16:27:45

标签: angular typescript

我收到以下错误:

Error:(7, 5) TS1148: Cannot compile modules unless the '--module' flag is provided.
Error:(7, 40) TS2307: Cannot find module 'angular2/angular2'.
Error:(8, 5) TS1205: Decorators are only available when targeting ECMAScript 5 and higher.
Error:(12, 11) TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Specify '--experimentalDecorators' to remove this warning.

不确定该怎么做。我在Angular网站上尝试了快速入门教程,下面是我的代码。我认为需要与打字稿一起完成某些事情,但是什么呢?

app.ts

import {Component, bootstrap} from 'angular2/angular2';
@Component({
    selector: 'my-app',
    template: '<h1>My First Angular 2 App</h1> <p>hello</p>'
})
class AppComponent { }

自举(AppComponent);

的index.html

<html>
  <head>
    <title>Angular 2 QuickStart</title>
    <script src="https://code.angularjs.org/tools/system.js"></script>
    <script src="https://code.angularjs.org/tools/typescript.js"></script>
    <script src="https://code.angularjs.org/2.0.0-alpha.44/angular2.dev.js"></script>
    <script>
      System.config({
        transpiler: 'typescript',
        typescriptOptions: { emitDecoratorMetadata: true }
      });
      System.import('./app.ts');
    </script>
  </head>
  <body>
    <my-app>loading...</my-app>
  </body>
</html>

1 个答案:

答案 0 :(得分:1)

我认为你需要tsconfig.json文件。这是一个示例内容:

 {
  "compilerOptions": {
    "target": "ES5",
    "module": "commonjs",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  }
}