0

Webpack の代わりに fusebox を使用して角度付きアプリを構成していますが、3 つの個別のバンドル (polyfills.js、vendor.js、および app.js) が必要です。

webpackではこれを使用しています:

'polyfills': './src/polyfills.ts',
'vendor': './src/vendor.ts',
'app': './src/main.ts'

polyfills.ts であること

import 'core-js/es6';
import 'core-js/es7/reflect';
require('zone.js/dist/zone');

if (process.env.ENV === 'production') {
  // Production
} else {
  // Development and test
  Error['stackTraceLimit'] = Infinity;
  require('zone.js/dist/long-stack-trace-zone');
}

および vendor.ts

import '@angular/platform-browser';
import '@angular/platform-browser-dynamic';
import '@angular/core';
import '@angular/common';
import '@angular/compiler';
import '@angular/http';
import '@angular/router';
import '@angular/forms';

import 'rxjs';
import './rxjs-extensions';

rxjs-extensions.ts を使用

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';

これをヒューズボックスに変更しました

fuse.bundle('polyfills').instructions('> polyfills.ts');
fuse.bundle('vendor').instructions('~ main.ts vendor.ts');
fuse.bundle('app').instructions('!> [main.ts]').watch().hmr();

この場合、ポリフィルは問題なく、ベンダーにはアプリ (~main.ts) からのすべてのサード パーティの依存関係と vendor.ts のすべてが含まれますが、アプリにはプロジェクト内のものしかありません。

正常にコンパイルされているようですが、コードを実行するERROR TypeError: this.http.get(...).map is not a functionと、service.get(...).map() で取得されます

vendor.ts が rxjs-extensions をインポートしていないように感じます。

誰でもこれを修正する方法を知っていますか?

私がちょうど使用する場合

fuse.bundle('polyfills').instructions('> polyfills.ts');
fuse.bundle('vendor').instructions('> vendor.ts');
fuse.bundle('app').instructions('> main.ts').watch().hmr();

それは機能しますが、私の app.js バンドルにはあま​​りにも多くのものが含まれており、303K から 2.4MB になります。

4

1 に答える 1