Типщик для JavaScript transpiler для Angular2

Question

Поскольку Ancular2 написан на языке TypeScript, я также пишу свое приложение в TypScript. Я хочу развернуть приложение на сервере tomcat без запуска node.js. После долгого поиска я нашел две возможности, которые работают: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5?p=preview В этой версии файлы TypScript перетаскиваются на лету, и это работает для того, что мне нужно. Но было бы более приятное решение с транспилингом и его минимизацией до развертывания на сервере. Я пробовал это с глотком, но полученные .ts-файлы (с и без минимизации) не работали. я обустроенный другой plunker только с JS-файлами, работающими: https://plnkr.co/edit/8lOtCy4GPsq9hZH6D38E?p=preview Сравнивая эти файлы, я увидел, что мои скомпилированные файлы выглядят гораздо сложнее:

"use strict"; 
 
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { 
 
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; 
 
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); 
 
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; 
 
    return c > 3 && r && Object.defineProperty(target, key, r), r; 
 
}; 
 
var core_1 = require("@angular/core"); 
 
var AppComponent = (function() { 
 
    function AppComponent() { 
 
     this.name = 'Angular'; 
 
    } 
 
    return AppComponent; 
 
}()); 
 
AppComponent = __decorate([ 
 
    core_1.Component({ 
 
     selector: 'my-app', 
 
     template: "<h1>Hello {{name}}</h1>" 
 
    }) 
 
], AppComponent); 
 
exports.AppComponent = AppComponent;

Так что я попытался с различным TSconfig. json свойства, чтобы получить рабочий транспилер, но он, кажется, что-то с транспилером (я использовал для обоих вариантов версию typescript@2.1.6)

Я уже пробовал с моделью в tsconfig.json beeing: amd, umd, system, commonjs, es2015, но это не решило проблему. Также я пробовал с noEmeritHelpers, но проблема все еще была (я думаю, что однажды я прочитал проблему с var core_1 = require("@angular/core");, не определенную, но это мне не помогло).

Я хочу перекрыть все .ts-файлы из папки своего приложения, объединить их в один, а затем убрать. Лучший способ сделать это - с помощью gulp, так как это было бы легко совместить с моим проектом maven.

Answer 1

использование Угловая CLI

https://github.com/angular/angular-cli

редактировать файл конфигурации angular-cli.json

"outDir": "path/to/maven-app/main/resources/webapp", 

, то вы можете запустить ng build --prod --watch или ng build --watch

затем построить свой Maven приложение, оно будет содержать все файл сборки: js, css, активы и т. д.