如何将 Angular 2 app.module 转换为 es6

Question

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

//purposefully removed some imports

@NgModule({
  declarations: [
    AppComponent,
    HeaderComponent,
    FooterComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    AddonsModule,
    PageBodyModule,
    NgbModule.forRoot(),
    OwlModule,
    AgmCoreModule.forRoot({
      apiKey: ''
    }),
    NouisliderModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

如何将这个用 TypeScript 编写的 Angular 2 代码转换成 ES6？我只想将这个 @NgModule ({...}) "app.module.ts" 部分转换为 ES6。由于我有一个 Angular 2 项目，我需要将其转换为 ES6。到目前为止，我只提出了这个问题。

Answer 1

在tsconfig.json 中，将module 的值从当前的值更改为es6。当 TypeScript 转译 TS 文件时，它将在 ES6 中进行。

如果您需要放弃对 TypeScript 的支持并依赖纯 JavaScript，您可以使用转译后的代码进行进一步的工作。

更新

如果要生成ES6代码，需要设置的是target，而不是module。 module 处理加载程序。您可以重用和更新的转译代码示例如下所示：

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;
};
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AppRouteModule } from './app.router';
import { AppComponent } from './app.component';
import { Tab1Component } from './tab1/tab1.component';
import { Tab2Component } from './tab2/tab2.component';
let AppModule = class AppModule {
};
AppModule = __decorate([
    NgModule({
        declarations: [
            AppComponent,
            Tab1Component,
            Tab2Component
    ],
    imports: [
        BrowserModule,
        RouterModule,
        AppRouteModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
], AppModule);
export { AppModule };
//# sourceMappingURL=app.module.js.map

在tsconfig.json设置target: "es2015"，你也可以设置module为相同的值。