Webpack und Angular2 Buildzeit

Question

Ich möchte die Kompilierzeit beschleunigen. Richtig, nicht dauert es um 40s und ich habe keine Ahnung, wie es schneller machen.

Ich habe versucht isolatedModules auf true in Config aber in Folge habe ich einen Fehler:

error TS1208: Cannot compile namespaces when the '--isolatedModules' flag is provided.

I webpack-stream bin mit Aufgabe in großen Schluck zu haben.

Meine Gulpfile.js Aufgabe

gulp.src('./tsScripts/users') 
     .pipe(webpack(
      { 
       entry: { 
        "core_users": "./Orchard.Web/Modules/Core/tsScripts/users/users.ts", 

        "resources_product": "./Orchard.Web/Modules/Resources/tsScripts/products/product.ts", 
        "resources_products": "./Orchard.Web/Modules/Resources/tsScripts/products/products.ts", 

        "xrm_contractors": "./Orchard.Web/Modules/Xrm/tsScripts/contractors/contractors.ts", 
        "xrm_contractors_create": "./Orchard.Web/Modules/Xrm/tsScripts/contractors/contractors.create.ts", 
        "xrm_contractors_edit": "./Orchard.Web/Modules/Xrm/tsScripts/contractors/contractors.edit.ts", 
        "xrm_contractors_details": "./Orchard.Web/Modules/Xrm/tsScripts/contractors/contractors.details.ts", 

        "resources_inventory": "./Orchard.Web/Modules/Resources/tsScripts/inventory/inventory.ts", 
        "resources_inventory_create": "./Orchard.Web/Modules/Resources/tsScripts/inventory/inventory.create.ts", 
        "resources_inventory_edit": "./Orchard.Web/Modules/Resources/tsScripts/inventory/inventory.edit.ts", 
        "resources_inventory_details": "./Orchard.Web/Modules/Resources/tsScripts/inventory/inventory.details.ts", 

        "phx_productRegistry": "./Orchard.Web/Modules/phx/tsScripts/productRegistry/productRegistry.ts", 
        "phx_productRegistry_create": "./Orchard.Web/Modules/phx/tsScripts/productRegistry/productRegistry.create.ts", 
        "phx_productRegistry_edit": "./Orchard.Web/Modules/phx/tsScripts/productRegistry/productRegistry.edit.ts", 
        "phx_productRegistry_details": "./Orchard.Web/Modules/phx/tsScripts/productRegistry/productRegistry.details.ts", 

        "vendor": "./Orchard.Web/Modules/Core/tsScripts/vendor.ts", 
        "polyfills": "./Orchard.Web/Modules/Core/tsScripts/polyfills.ts" 
       }, 
       output: { 
        path: __dirname, 
        filename: "./[name].js" 
       }, 
       resolve: { 
        extensions: ['', '.ts', '.js'], 
        unsafeCache: true, 
       }, 
       cache: true, 
       devtool: 'eval', 
       module: { 
        loaders: [ 
         { 
          test: /\.ts/, 
          loaders: ['ts-loader'], 
          exclude: [/\.(spec|e2e)\.ts$/, /node_modules\/(?!(ng2-.+))/], 
          options: { 
           transpileOnly: true 
          } 
         }, 
        ] 
       }, 
       plugins: [ 
        new wpack.ProvidePlugin({ 
         $: "jquery", 
         jQuery: "jquery", 
         "window.jQuery": "jquery", 
        }), 
        new wpack.optimize.CommonsChunkPlugin(
         { 
          name: "vendor", 
          minChunks: Infinity 
         }) 
       ] 
      } 
     )) 
     .pipe(gulp.dest('Scripts/main/')); 

vendor.ts

///<reference path="./typings/globals/core-js/index.d.ts"/> 
///<reference path="./node_modules/@types/jquery/index.d.ts"/> 
///<reference path="./node_modules/@types/select2/index.d.ts"/> 

import 'zone.js/dist/zone'; 
import '@angular/common'; 
import '@angular/compiler'; 
import '@angular/core'; 
import '@angular/forms'; 
import '@angular/http'; 
import '@angular/platform-browser'; 
import '@angular/platform-browser-dynamic'; 
import '@angular/router'; 
import 'jquery'; 
import 'angular2-datatable'; 
import 'angular2-modal'; 
import 'rxjs'; 
import 'datatables' 
import 'select2' 

Alles funktioniert gut, aber warten ~ 40er Jahre für jeden Build ... Es ist zu lang. Ich habe versucht, jQuery als extern zu setzen, aber es gab mir 1-3s. Vielleicht externe angular2? Oder ich habe etwas falsch gemacht und Webpack sucht nach Dateien in meiner gesamten Lösung. Vielen Dank im Voraus für jede Hilfe.

Answer 1

Während der Entwicklung können Sie den Webpack-Watch-Modus verwenden, der eine inkrementelle Kompilierung ermöglicht.