Wo finde ich die neueste ionic-angular2-Version in einem Plotter mit @Ngmodule?

Question

Ich lerne ionic 2 von hier. http://ionicframework.com/docs/v2/getting-started/tutorial/project-structure/ Ich überprüfe, es gibt Online-Editor für ionische 2 mit einfachen Beispiel.

https://plnkr.co/edit/SJ8GtqbRntby5yGzLEft?p=preview .Aber Beispiel verwendet nicht Ngmodule .Ich denke Plunker old ist .can wir das gleiche Beispiel mit neuesten ionic 2 Version mit Ngmodule machen.

@NgModule({ 
    declarations: [MyApp,HelloIonicPage, ItemDetailsPage, ListPage], 
    imports: [IonicModule.forRoot(MyApp)], 
    bootstrap: [IonicApp], 
    entryComponents: [MyApp,HelloIonicPage,ItemDetailsPage,ListPage], 
    providers: [] 
}) 
export class AppModule 
{} 

können wir machen Hallo Welt Programm mit den neuesten ionischen Version in Plunker

Answer 1

Sie einen Blick darauf werfen können an meinem Plunker Example ionic-angular@2.0.0-rc.1

Systemjs Config wie folgt aussieht:

(function(global) { 
    var packages = { 
    app: { 
     main: './main.js', 
     defaultExtension: 'js' 
    }, 
    rxjs: { 
     defaultExtension: 'js' 
    }, 
    'ionic-angular': { 
     main: 'index.js', 
     defaultExtension: 'js' 
    } 
    }; 

    ['core', 
    'common', 
    'compiler', 
    'forms', 
    'http', 
    'platform-browser', 
    'platform-browser-dynamic', 
    'router' 
    ].forEach(function (name) { 
    packages['@angular/' + name] = { main: 'index.js' }; 
    }); 

    var config = { 
    transpiler: 'typescript', 
    typescriptOptions: { 
     emitDecoratorMetadata: true 
    }, 
    paths: { 
     'npm:': 'https://unpkg.com/' 
    }, 
    map: { 
     'app': 'src', 
     '@angular': 'npm:@angular', 
     'ionic-angular': 'npm:ionic-angular', 
     'rxjs': 'npm:rxjs', 
     'typescript': 'npm:typescript/lib/typescript.js' 
    }, 
    //packages defines our app package 
    packages: packages 
    }; 

    System.config(config); 
})(this); 

Hoffe, das wird Ihnen bei Ihrer Codierung helfen!

Answer 2

Ab diesem Datum this plunker seems to work, version: ionic-angular@2.0.0-rc.4

Dies ist die Systemjs config:

/** 
* PLUNKER VERSION 
* (based on systemjs.config.js in angular.io) 
* System configuration for Angular samples 
* Adjust as necessary for your application needs. 
*/ 
(function (global) { 
    System.config({ 
    // DEMO ONLY! REAL CODE SHOULD NOT TRANSPILE IN THE BROWSER 
    transpiler: 'ts', 
    typescriptOptions: { 
     tsconfig: true 
    }, 
    meta: { 
     'typescript': { 
     "exports": "ts" 
     } 
    }, 
    paths: { 
     // paths serve as alias 
     'npm:': 'https://unpkg.com/' 
    }, 
    // map tells the System loader where to look for things 
    map: { 
     // our app is within the app folder 
     app: 'app', 
     pages: 'pages', 

     // angular bundles 
     '@angular/core': 'npm:@angular/core@2.2.1/bundles/core.umd.js', 
     '@angular/common': 'npm:@angular/common@2.2.1/bundles/common.umd.js', 
     '@angular/compiler': 'npm:@angular/compiler@2.2.1/bundles/compiler.umd.js', 
     '@angular/platform-browser': 'npm:@angular/platform-browser@2.2.1/bundles/platform-browser.umd.js', 
     '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic@2.2.1/bundles/platform-browser-dynamic.umd.js', 
     '@angular/http': 'npm:@angular/http@2.2.1/bundles/http.umd.js', 
     '@angular/forms': 'npm:@angular/forms@2.2.1/bundles/forms.umd.js', 

     'ionic-angular': 'npm:ionic-angular@2.0.0-rc.4', 
     'rxjs': 'npm:rxjs@5.0.0-beta.12', 
     'ts': 'npm:plugin-typescript@5.3.1/lib/plugin.js', 
     'typescript': 'npm:typescript@2.0.10/lib/typescript.js', 

    }, 
    // packages tells the System loader how to load when no filename and/or no extension 
    packages: { 
     app: { 
     main: './main.ts', 
     defaultExtension: 'ts' 
     }, 
     pages: { 
     defaultExtension: 'ts' 
     }, 
     rxjs: { 
     defaultExtension: 'js' 
     }, 
     'ionic-angular': { 
     main: './umd/index.js', 
     defaultExtension: 'js' 
     } 
    } 
    }); 
})(this); 


/* 
Copyright 2016 Google Inc. All Rights Reserved. 
Use of this source code is governed by an MIT-style license that 
can be found in the LICENSE file at http://angular.io/license 
*/ 

Und TSconfig:

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "commonjs", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": false, 
    "noImplicitAny": true, 
    "suppressImplicitAnyIndexErrors": true 
    } 
} 

Answer 3

Hier ist diejenige, die ich erstellt: http://plnkr.co/edit/y8R0MF?p=info

zu Ionic aktualisiert 3.2.1 und 4.2.2 Winkel Es dumm einfach ist das funktioniert, aber

// angular bundles 
     '@angular/core': 'npm:@angular/core@4.1.2/bundles/core.umd.js', 
     '@angular/common': 'npm:@angular/common@4.1.2/bundles/common.umd.js', 
     '@angular/compiler': 'npm:@angular/compiler@4.1.2/bundles/compiler.umd.js', 
     '@angular/platform-browser': 'npm:@angular/platform-browser@4.1.2/bundles/platform-browser.umd.js', 
     '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic@4.1.2/bundles/platform-browser-dynamic.umd.js', 
     '@angular/http': 'npm:@angular/http@4.1.2/bundles/http.umd.js', 
     '@angular/forms': 'npm:@angular/forms@4.1.2/bundles/forms.umd.js', 

     'ionic-angular': 'npm:ionic-angular@3.2.1', 
     'rxjs': 'npm:rxjs@5.0.0-beta.12', 
     'ts': 'npm:plugin-typescript@5.2.7/lib/plugin.js', 
     'typescript': 'npm:typescript@2.0.7/lib/typescript.js', 

    },