how can I convert angular 2 app.module into 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 { }

How can I convert this code written Angular 2 in TypeScript into ES6? I only want to convert this @NgModule ({...}) "app.module.ts" part into ES6. Since I have an Angular 2 project which I need to convert into ES6. Up to now I only came up with this issue.

What is version of Angular?

Sergey Andreev
– Sergey Andreev

2017-09-29 11:00:02 +00:00
Commented Sep 29, 2017 at 11:00 — Sergey Andreev
– Sergey Andreev, Commented Sep 29, 2017 at 11:00
Angular 2 or above any version to es6 @SergeyAndreev

Dilakshan Sooriyanathan
– Dilakshan Sooriyanathan

2017-09-29 11:04:13 +00:00
Commented Sep 29, 2017 at 11:04 — Dilakshan Sooriyanathan
– Dilakshan Sooriyanathan, Commented Sep 29, 2017 at 11:04

Community · Accepted Answer · 2020-06-20 09:12:55Z

In tsconfig.json change the module value from whatever it is at the moment to es6. When TypeScript transpiles the TS file it will do it in ES6.

If you need to drop TypeScript support and rely on pure JavaScript, you can use the transpiled code for your further work.

Update

If you want to generate ES6 code, it is target that you need to set, not the module. module deals with the loader. An example of transpiled code that you can reuse and update would be something like this:

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

in tsconfig.json set target: "es2015", you can also set module to the same value.

yes, but I want to know how to hard code @NgModule (app.component.ts) into es6. since I want to make it a separate project rather from angular 2. even I have a separate gulp file.
The transpiled code will give you the code that you can reuse in order to hard code, wherever you plan to hard code it. Open the JS file and examine it. It will define a __decorate variable that you use later to define declarations, exports, etc.
BTW the problem is I'm not going to use tsconfig.json I have a separate gulp file which it will convert es6 to es5 using babel and browserify. including watch tasks. :/

Collectives™ on Stack Overflow

how can I convert angular 2 app.module into es6

1 Answer 1

Update

3 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Update

3 Comments

Related