角度2.2とSystemJS：deploy RXJS

Question

私はウェブサイトを展開していますが、最終バージョンのAngularを使用しているため、rxjsを "バンドル"できません。 私のウェブサイトには、フォルダ全体をコピーしてrxjsを展開することしかできません。node_modules/rxjsここで

がSystemJS

System.config({ 
     map: { 
      'lodash':'http://127.0.0.1/js/lodash.min.js', 
      '@angular/core': 'http://127.0.0.1/js/core.umd.min.js', 
      '@angular/compiler': 'http://127.0.0.1/js/compiler.umd.min.js', 
      '@angular/common': 'http://127.0.0.1/js/common.umd.min.js', 
      '@angular/http': 'http://127.0.0.1/js/http.umd.min.js', 
      '@angular/platform-browser': 'http://127.0.0.1/js/platform-browser.umd.min.js', 
      '@angular/platform-browser-dynamic': 'http://127.0.0.1/js/platform-browser-dynamic.umd.min.js', 
      '@angular/router': 'http://127.0.0.1/js/router.umd.min.js', 
      '@angular/forms': 'http://127.0.0.1/js/forms.umd.min.js', 
      '@angular/upgrade': 'http://127.0.0.1/js/upgrade/bundles/upgrade.umd.js', 
      'rxjs':'http://127.0.0.1/js/vendors.bundle.js' 
     }, 
     packages: { 
      '/js': { 
       defaultExtension: 'js' 
      } 
     }, 
     bundles: { 
      '/js/app.bundle': ['main'] 
     } 
    }); 

    document.addEventListener('DOMContentLoaded', function() { 
     System.import('main').then(null, console.error.bind(console)); 
    }); 

の私の構成である私は、次のがぶ飲みスクリプトを使用してvendors.bundle.jsでrxjsを含めています：

gulp.task('vendor.bundle', function() { 
     gulp.src([ 
      'node_modules/systemjs/dist/system-polyfills.js', 
      'node_modules/zone.js/dist/zone.min.js', 
      'node_modules/reflect-metadata/Reflect.js', 
      'node_modules/systemjs/dist/system.src.js', 
      'node_modules/rxjs/bundles/Rx.min.js' 
     ]) 
      .pipe(concat('vendors.bundle.js')) 
      //.pipe(uglify()) 
      .pipe(gulp.dest('./dist/js')); 
    }); 

私は、次のようなエラーがあります。

VM9314：3GET http://127.0.0.1/js/vendors.bundle.js/add/operator/map.js 404（見つからない）... 01 「rxjs//オペレータ/マップを追加」それは我々が* /すべてrxjsを取得するための要求の膨大な数を生成するフォルダ全体を、展開する際に問題があるためだhttp://127.0.0.1/services/global-services/global.services

から。JSファイルとして読み込みエラーhttp://127.0.0.1/js/vendors.bundle.js/add/operator/map.jsと主にモバイルデバイス上のパフォーマンスが低いことを意味します。

私はRx.min.jsファイルだけを展開していたときに、その辺の問題はありませんでした。

配備方法を教えてもらえますかrxjs Angular 2.2 et SystemJSを使用していますか？

Answer 1

Thx to @martin！ :)ここで

は、ソリューションです： 1.あなたのに2.Declareバンドル独自のガルプ（私の場合）を使用してRx.min.jsとsystemjsビルダー

var SystemBuilder = require('systemjs-builder'); 
gulp.task('rxjs.bundle', function() { 
    var builder = new SystemBuilder('./', { 
     paths: {"rxjs/*": "node_modules/rxjs/*.js"}, 
     map: {"rxjs": "node_modules/rxjs"}, 
     packages: {"rxjs": {main: 'Rx.js', defaultExtension: "js"}} 
    }); 

    builder.bundle('rxjs', 'dist/js/Rx.min.js', { 
     sourceMaps: true, 
     minify: true, 
     mangle: true 
    }); 
}); 

を構築しますSystemJS構成ファイル。

System.config({ 
    map: { 
     'lodash':'http://127.0.0.1/js/lodash.min.js', 
     '@angular/core': 'http://127.0.0.1/js/core.umd.min.js', 
     '@angular/compiler': 'http://127.0.0.1/js/compiler.umd.min.js', 
     '@angular/common': 'http://127.0.0.1/js/common.umd.min.js', 
     '@angular/http': 'http://127.0.0.1/js/http.umd.min.js', 
     '@angular/platform-browser': 'http://127.0.0.1/js/platform-browser.umd.min.js', 
     '@angular/platform-browser-dynamic': 'http://127.0.0.1/js/platform-browser-dynamic.umd.min.js', 
     '@angular/router': 'http://127.0.0.1/js/router.umd.min.js', 
     '@angular/forms': 'http://127.0.0.1/js/forms.umd.min.js', 
     '@angular/upgrade': 'http://127.0.0.1/js/upgrade/bundles/upgrade.umd.js' 
    }, 
    packages: { 
     '/js': { 
      defaultExtension: 'js' 
     } 
    }, 
    bundles: { 
     '/js/Rx.min.js': [ 
      "rxjs/*", 
      "rxjs/operator/*", 
      "rxjs/observable/*", 
      "rxjs/add/operator/*", 
      "rxjs/add/observable/*", 
      "rxjs/util/*" 
     ], 
     '/js/app.bundle': ['main'] 
    } 
}); 

document.addEventListener('DOMContentLoaded', function() { 
    System.import('main').then(null, console.error.bind(console)); 
}); 

偉大なthx martin、私は苦労し、解決策は非常に長い議論の中で深いものでした。私は完全にそれを逃した:)

更新！

解決策を試した後、パフォーマンスが大幅に改善されたことを確認できます。私のホームページをロードする時間は約15秒でしたが、現在は3秒です！