問題タブ [webpack-plugin]

バンドルに追加のファイルを含む webpack プラグインを作成しています (子コンパイラを使用)。これは問題なく動作しますが、今は監視サポートを追加したいと考えています。問題は、そこから関数を抽出しているため、インクルードされたファイルがメイン コンパイラ インスタンス内のすべてのファイルに依存する可能性があることです。通常、これは、プラグインによって提供される機能の一部を実際に使用しているファイルの小さなサブセットにのみ分類されます。私のアイデアは、プラグインがリソースを再度コンパイルする必要があるたびにインクリメントされるバージョン フラグを使用して、監視サポートを実装することでした...ただし、バージョンは、親コンパイラからのすべてのファイルがコンパイルされた後にのみ変更されます。親のファイルがコンパイルされた後、アセットが発行される前にモジュールの再構築を強制する方法はありますか (発行イベントは問題ありません。

私が達成しようとしていることはそれほど難しいことではないように感じます..しかし、webpackのドキュメントは深刻な混乱に陥っており、これに何時間も費やしています.

「動的」モジュールを webpack ビルドに挿入するにはどうすればよいですか? ビルド時にこのモジュールを作成したい。

簡単な例として、ビルド時にこの文字列を新しいモジュールとして挿入するにはどうすればよいですか?

次に、そのモジュールに「myDate」という名前を付けたいとしましょう

アプリケーション内の他のモジュールを次のように解決できるようにしたいと思います。

これは非常に単純な例です。私の目的はもっと複雑で、ファイルを読み取ってこの「動的」モジュールを作成する必要があります。define プラグインは知っていますが、残念ながら私のニーズには合いません。

助けていただければ幸いです。ありがとう。

ts-loadertypescript ソースファイルを javascript バンドルにコンパイルするために webpack ローダーを使用しています。ここで、バンドルだけでなく、個別にコンパイルされた JavaScript ファイルも保存したいと思います。私は非常に単純な webpack プラグインの作成に慣れていますが、これを実装する方法がわかりません。つまり、webpack によってトリガーされたどのイベントをリッスンするのか、関連するデータがどこにあるのかわかりません。何か助けはありますか？

翻訳サービス用の Webpack プラグインの作成に問題があります。

目標は次のとおりです。

1. コンパイル中に必要なすべてのモジュールの名前 (およびソース コード) を取得します。含まれているソース コードをスキャンして特別なt()機能を使用できるようにする必要がありますが、バンドルに含まれるモジュールのみをスキャンしたいと考えています (ビルド構成によっては、すべてのプロジェクト モジュールのサブセットになる可能性があります)。
2. 収集したモジュールに基づいて、追加のモジュール (翻訳付き) をその場で作成し、それらをバンドルに追加したいと考えています。これらのモジュールは、独自の依存関係をインポートできる必要があります。

追加の要件は、Webpack のコード分割機能が、オンザフライで作成されたモジュールで動作することです (それらを個別のファイルに抽出したい - などbundle.[lang].js)。また、これはこの質問の範囲外かもしれませんが、これらのチャンクを翻訳付きでオプションにする必要があります (したがって、すべての言語をロードする必要はなく、1 つだけをロードする必要があります)。

詳細については、https://github.com/ckeditor/ckeditor5/issues/387を参照してください。

複数のソリューションを試してきましたが、Webpack 2 のドキュメントはあまり役に立ちません。モジュール解決フックをリッスンすることですべてのモジュールを取得できますbefore-resolve(addEntryいつ使用できますか？）。

Webpack プラグインと Webpack ローダーを接続することも考えていましたが (必要な機能はWebpack の style-loaderにかなり似ているため)、プラグイン レベルからは、ローダー自体ではなく、ローダーへのパスのみを追加できるので、できます。構成オブジェクトをパラメーターとして渡す – 私は間違っていますか?

PS。私は Webpack 2 を使用しています。要件が奇妙に思われる場合は、 https ://github.com/ckeditor/ckeditor5/issues/387を参照してください:)。

angular、react、lodashなどのサードパーティライブラリを含むベンダーバンドルを作成するためにwebpack共通チャンクプラグインを使用する前に、webpack dllプラグインについて知っていました。それらは同じことをしているように見えますが、dll プラグインを使用すると、ビルド時間を短縮することもできます。したがって、これらの両方のプラグインを一緒に使用する必要があるかどうか混乱しています。プロダクション ビルドでベンダー バンドルを作成し、開発ビルドで dll プラグインを作成するために共通のチャンク プラグインを使用する必要があります。または、本番ビルドと開発ビルドの両方で dll プラグインを使用する必要がありますか? これについて説明していただけますか？

この投稿の主な目的は、Webpack プラグインの作成中にエラー/警告の管理に関する追加情報を取得することです。

Webpack プラグインのドキュメントで、(コールバックで) タイミング ベースのプラグイン インターフェイスにパラメーターを渡すことができることを見てきましたerrが、それが Webpack のライフサイクルやビルド プロセスにどのように影響するかについては、これ以上の説明はありません。そしてそれを使用する方法。他のタイプのプラグイン インターフェイスでエラーを管理する方法があるかどうかも説明されていません。

とにかく、最初の試行として、ライフサイクルステップで、パラメーターに aまたは単に値'emit'を渡そうとしましたが、どちらの場合も、コンソールに指定された err パラメーターをそのまま表示しました (IE 悲しいことに、エラー固有の配色)、および webpack-sev-server がスタックしました:errnew Error('An error has occurred')'An error has occured'

そのため、Webpack ビルド プロセスを再開するには、次の方法で追加のコールバックを呼び出す必要がありました。

残念ながら、この方法では、Webpack のライフサイクルにまったく影響を与えることなく、色付けされていない文字列を stdout に表示するだけです。

私が達成しようとしているのは、エラーの場合に赤いエラー メッセージを表示し、バンドル ビルド プロセスがvalid最終的に新しいビルドでプラグインがエラーなしで実行されるまで状態で終了しないようにすることです。

警告管理については、プラグイン自体の中で直接適切なカラーリングを使用して呼び出すかprocess.stdout.write()、コンパイル パラメーターで警告コレクションをフィードすることによって実行する必要があると思いますが、これまでに報告したことと同様 SO の質問...推測にすぎません:p

記録のために、この質問をするのは、アプリケーション内に散在するすべての翻訳を 1 つのファイルに集約することを目的とする小さなビルド ツールを作成したからです。これは、クライアントが数十ではなく単一の翻訳ファイルを処理できるようにするためです。

「ワンショット」モードまたは監視モードで実行できますが、これをプラグインとして Webpack ビルド プロセスに直接統合するのが最善だと思います。

Webpack の新参者である私は、Webpack のすべての可能性を完全に受け入れておらず、何ができるか/何をすべきかによって誤解を招く可能性があります。それ（もちろん、それはこの投稿の主な理由ではないので、補足として;）

それについてのあなたのヒントとコツを前もってありがとう;）！