Angular 2，开发环境非常慢（我是否需要开发包？）

我刚开始使用Angular 2的新应用程序。我只是在angular.io快速入门之后才构建它。应用程序非常缓慢，经过一些研究，我发现了一些使用SystemJS + Gulp的解决方案。我做了非常像这个https://stackoverflow.com/a/37082199/3067873这是很好的生产。速度非常快。但另一方面，这对发展非常不利。它太慢了（捆绑需要很长时间才能完成）。如果我不使用捆绑也很慢（数百个请求）。我试图创建一个没有我的应用程序转发文件的包，但它不起作用。Angular 2，开发环境非常慢（我是否需要开发包？）

所以一个简短的问题是：如何设置开发环境避免成百上千的请求并生成一个没有我的应用程序转发文件的包？或者任何其他想法/配置可以帮助我更高效地开发。

gulpfile.js

var gulp = require('gulp'), 
     path = require('path'), 
     Builder = require('systemjs-builder'); 

    var appDev = './app'; 
    var appProd = './app'; 

    gulp.task('bundle', function() { 
     var builder = new Builder('', 'systemjs.config.js'); 

     return builder 
      .buildStatic(appDev + '/main.js', appProd + '/bundle.js', { minify: true, sourceMaps: true}) 
      .then(function() { 
       console.log('Build complete'); 
      }) 
      .catch(function(err) { 
       console.log('Build error'); 
        console.log(err); 
       }); 
     }); 

    gulp.task('default', ['bundle']);

systemjs.config.js

/** 
    * System configuration for Angular samples 
    * Adjust as necessary for your application needs. 
    */ 
    (function (global) { 
     System.config({ 
     paths: { 
      // paths serve as alias 
      'npm:': 'node_modules/' 
     }, 
     // map tells the System loader where to look for things 
     map: { 
      // our app is within the app folder 
      app: 'app', 
      // angular bundles 
      '@angular/core': 'npm:@angular/core/bundles/core.umd.js', 
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js', 
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js', 
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js', 
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js', 
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js', 
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js', 
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js', 
      // other libraries 
      'rxjs':      'npm:rxjs', 
      'angular2-in-memory-web-api': 'npm:angular2-in-memory-web-api', 
      'primeng':     'node_modules/primeng' 
     }, 
     // packages tells the System loader how to load when no filename and/or no extension 
     packages: { 
      app: { 
      main: './main.js', 
      defaultExtension: 'js' 
      }, 
      rxjs: { 
      defaultExtension: 'js' 
      }, 
      'angular2-in-memory-web-api': { 
      main: './index.js', 
      defaultExtension: 'js' 
      }, 
      primeng : { defaultExtension: 'js' } 
     } 
     }); 
    })(this);

来源

2016-09-30 eugeniobac

我不确定数百个请求来自哪里 - 您的systemjs配置有您的应用程序+ 8个角度捆绑包+ 3个其他依赖项。它是由primeng引起的吗？如果是这样，您需要捆绑该依赖项，以便只将您的应用程序作为单独的文件加载。 – artem

查看官方角度-CLI在https://github.com/angular/angular-cli

它使用的WebPack 2和具有不同的不同的设置环境。开发建设时间非常快。

来源

2016-09-30 05:26:47

感谢您的询问。我会看看这个。但是，如果我现在继续使用该解决方案，那会更好。 – eugeniobac

Angular 2，开发环境非常慢（我是否需要开发包？）

回答

相关问题