問題タブ [code-splitting]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
webpack - Webpack 2 非同期コード分割での CDN フォールバック
webpack 2 で非同期チャンクのフォールバックを設定する方法はありますか?
これは私が持ちたいものです：
- http://cdn.example.com/chunk-1.jsのロードに失敗-> http://another-cdn.example.com/chunk-1.jsのロード
- http://another-cdn.example.com/chunk-1.jsのロードに失敗-> http://www.example.com/chunk-1.jsのロード
Fallback JSが提供する Like 機能
// Include `jQuery`.
"jQuery": {
// The URLs to load `jQuery`.
"urls": [
"//.....some-bad-cdn...../.....FAIL-ON-PURPOSE.....",
"//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min",
"//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min"
]
},
Code Splitting - Asyncのドキュメントを読みました。関連するオプションはありません。
解決策にたどり着いた最も近い方法は、 require.ensure エラー コールバック内の新しい URL に対して別の jsonp リクエストを発行することですが、エラー イベントからチャンク URL を取得できません。
======== 6月12日更新 ========
この問題についてはある程度の進展がありましたが、別の障害があります。パブリック パスは動的に変更できますが、manifest.js (共通チャンク プラグインによって生成される) の webpack ランタイム コードにコードを挿入する必要があります。
angularjs - Angular 1.5 - webpack と babel 6 を使用したツリーの揺れ
非常に古いプロジェクトで、エクスプレスでAngular 1.5を使用しています。今、私はそれを改良する必要があります（再構築ではありません）。
私はいくつかのwebpack最適化を追加し、それをクライアント側に転送して、Angularアプリケーションをレンダリングし、サーバーコードをクライアントコードと分離していました。
私の最終目標は、webpack 2 と angular 1.5 を使用して完全なワークフローを作成し、ES6,6 の機能と最新のコード標準を使用することです。
すべてのモジュールをオンデマンドでロードできるように、コード分割やツリー シェーキングなどの webpack 2 機能を使用したいと考えています。
このために、webpack 構成を作成しました。から削除{modules: false}しても問題なく動作します.babelrcが、これを追加することはツリーの揺れに不可欠です。
私の問題は、これは、ツリーシェーキングを実装するために必要なほとんどすべてです。しかし、このすべての後でも、ビルド後の私の app.hash.js ファイルにはすべてangularとlodashコードが含まれています。代わりにmodule、angularmapの場合とlodashの場合のみのコードにする必要があります。
これは私のアプリのインデックスです
これは私のwebpack confです
これは.babelrcファイルごとです