サーバー側でレンダリングされるアプリケーションを開発する環境での作業を開始しwebpack
ていnode/express
ます。開発環境と本番環境(ランタイム)環境での各Webpackパッケージの役割について非常に混乱しています。ReactJS
react-router
これが私の理解の要約です:
webpack
:パッケージであり、Webアプリケーションのさまざまな部分を結合して1つの.jsファイルにバンドルするツールです(通常はbundle.js
)。結果ファイルは、アプリケーションによってロードされる本番環境で提供され、コードを実行するために必要なすべてのコンポーネントを含みます。コードの縮小、縮小などの機能があります。
webpack-dev-server
:Webサイトのファイルを処理するサーバーを提供するパッケージです。またbundle.js
、クライアントコンポーネントから単一の.jsファイル()を構築しますが、メモリで提供します。また、-hot
すべてのビルドファイルを監視し、コードが変更された場合にメモリ内に新しいバンドルをビルドするオプション()もあります。サーバーはブラウザーで直接提供されます(例:)http:/localhost:8080/webpack-dev-server/whatever
。インメモリロード、ホットプロセッシング、ブラウザーサービスの組み合わせにより、ユーザーはコードが変更されたときにブラウザーでアプリケーションを更新でき、開発環境に最適です。
上記のテキストに疑問がある場合、以下の内容は本当にわかりません。必要に応じてお知らせください
使用して一般的な問題webpack-dev-server
とnode/express
IS webpack-dev-server
であるとして、サーバーですnode/express
。そのため、この環境では、クライアントと一部のノード/エクスプレスコード(APIなど)の両方を実行するのが難しくなっています。注:これは私が直面している問題ですが、なぜこれが発生するのかを詳しく理解するのに役立ちます...
webpack-dev-middleware
:これは同じ機能webpack-dev-server
(インメモリバンドリング、ホットリロード)を備えたミドルウェアですが、server/express
アプリケーションに挿入できる形式になっています。このようにしてwebpack-dev-server
、ノードサーバーの内部に一種のサーバー()があります。 おっと:これはクレイジーな夢ですか??? この作品はどのようにして開発と製品の方程式を解決し、人生をよりシンプルにすることができますか
webpack-hot-middleware
:これ... ここにくっついて...探しているときにこの部分が見つかりました... webpack-dev-middleware
使い方がわかりません。
ENDNOTE:申し訳ありませんが、間違った考えがあります。複雑な環境でこれらのバリアントを理解するために本当に助けが必要です。都合がよければ、シナリオ全体を構築するパッケージ/データを追加してください。
webpack-dev-middleware
(webpack-hot-middleware
場合によっては)を使用します。必要のない特定の機能がない限りwebpack-dev-server
、それを使用する必要があります。