编译Angular2 TS文件 [英] Compile Angular2 ts file

问题描述

我试图用Angular2打字稿，但我有一个TSC问题。

这是我的tsconfig.json文件：

  {
compilerOptions：{
    模块：CommonJS的
    noImplicitAny：真实，
    removeComments：真实，
    preserveConstEnums：真实，
    出来：compiled.js
    emitDecoratorMetadata：真实，
    目标：ES5
}，
文件：
    TS / _base / _all.ts
]
}
 

这是我的_all.ts文件：

  ///＆lt;参考路径=./分型/ libs.d.ts/＆GT;
///＆lt;参考路径=../ app.ts/＆GT;
///＆lt;参考路径=../控制器/ loginCtrl.ts/＆GT;
 

这是我的应用程序控制器：

 进口{组件，查看，引导}从'angular2 / angular2';@零件（{
    选择：我的应用
}）
@视图（{
    模板：`Hi`
}）类MyAppComponent
{
    构造函数（）
    {
    }
}引导（MyAppComponent）;
 

正常运行的 TSC 的我得到一个输出文件（ compiled.js 的），但使用angular2我得到一个.js文件中的每个TS文件（TSC所以不合并输出）...

我注意到这个问题是使用import语句present：

 进口{组件，查看，引导}从'angular2 / angular2';
 

省略这一行，输出正确合并（但没有进口我不能使用的模块）。

我在做什么错了？

解决方案

  

运行正常TSC我得到一个输出文件（compiled.js），但使用angular2我得到的每一个js文件的TS文件（TSC因此不会合并输出）...

这是因为你使用导入这里：进口{组件，查看，引导}从'angular2 / angular2'; 这使你的code时的外部模块的（更多：的 https://www.youtube.com/watch?v=KDrWLMUY0R0&hd=1 ）。

请注意：我建议在外部模块 - 从反正：的 https://github.com/TypeStrong/atom-typescript/blob/master/docs/out.md

I'm trying Angular2 using Typescript, but I have a problem with tsc.

This is my tsconfig.json file:

{
"compilerOptions": {
    "module": "commonjs",
    "noImplicitAny": true,
    "removeComments": true,
    "preserveConstEnums": true,
    "out": "compiled.js",
    "emitDecoratorMetadata":true,
    "target":"es5"
},
"files": [
    "ts/_base/_all.ts"
]
}

This is my _all.ts file:

///<reference path="./typings/libs.d.ts"/>
///<reference path="../app.ts"/>
///<reference path="../controllers/loginCtrl.ts"/>

And this is my app controller:

import {Component, View, bootstrap} from 'angular2/angular2';

@Component({
    selector: 'my-app'
})
@View({
    template: `Hi`
})

class MyAppComponent 
{   
    constructor() 
    {
    }
} 

bootstrap(MyAppComponent); 

Normally running tsc I get a single output file (compiled.js), but using angular2 I get one .js file for each ts file (so tsc does not merge the output)...

I noticed that the problem is present using the import statement:

import {Component, View, bootstrap} from 'angular2/angular2';

Omitting this line, the output is correctly merged (but without the import I cannot use the module).

What I'm doing wrong?

解决方案

Normally running tsc I get a single output file (compiled.js), but using angular2 I get one .js file for each ts file (so tsc does not merge the output)...

This is because you are using import here : import {Component, View, bootstrap} from 'angular2/angular2'; This makes your code an external module (more : https://www.youtube.com/watch?v=KDrWLMUY0R0&hd=1).

Note: I recommend external modules over --out anyways :https://github.com/TypeStrong/atom-typescript/blob/master/docs/out.md

这篇关于编译Angular2 TS文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！