問題タブ [webpack-dev-server]

どういうわけか、次のコマンドを実行すると、jsxhint が webpack によってコンパイルされたファイルを分析しているようです

これらの警告が表示されます

アプリケーション内のファイルの約 30% に対して。

に行くと、クロムdevtoolsで利用可能な（処理された）ファイルに対応する行番号と文字番号を参照しますSources Tab > webpack:// > . > relative-path-to-file。これらのファイルがディスク上のどこにあるかを見つけて、プリローダーの除外リストに追加しようとしましたが、webpack-dev-server ドキュメントによると、これらのファイルはメモリから提供されます。

アプリケーションとすべてのノード モジュールを完全に削除し、リポジトリから再度チェックアウトしようとしましたが、問題は解決しませんでした。

node_modulesこの問題は、フォルダーを削除した後、package.json ファイル内のノード モジュールを更新した後に発生しました。すべてのノード モジュールを以前のバージョンにロールバックしようとしましたが、問題は解決しません。

webpack.config.js の内容

パッケージ.json

今日、webpack を試してみることにしましたが、質問に行き詰まっています。

私たちのアプリケーションは API と通信します。API は構成可能であり、これまでのところ、config.js が適切な構成オプションで作成されるようにする構成オプションを gulpfile に許可することでそれを行ってきました。

webpackでも同じことができましたが、もっときれいに解決できるはずだと感じています。私はDefinePluginを調べました。build .js ファイルで使用するプロパティを定義できるため、これで問題が部分的に解決されます。

ただし、クロス ブラウザ リクエストを使用しているため、index.html 内に xdomain もロードしています。

これが問題の始まりです。definePlugin プラグインは、HTML ではなく、ビルドされたJavaScript ファイルで使用する変数のみを定義します。したがって、このようなものをJSファイルに移動できますが、webpackと組み合わせてIE9のみにする方法がわかりません。

誰でも私を啓発できますか？

現在、boot2docker を介してホット ローディングwebpack-dev-serverを使用しようとしています。

を使用して、コンテナでファイルの変更を正しく取得していますdocker-osx-devが、socket.io のホット リロードが機能していません。

その理由は--host 0.0.0.0、ホストマシンでアクセスできるように、サーバーの実行時に設定したためです。ただし、これは で socket.io サーバーを探していることを意味します0.0.0.0。

そのため、ページをロードすると、接続が試行さhttp://0.0.0.0:8080/socket.io/?EIO=3&transport=polling&t=1434584701670-0れ、consul でエラーが発生します。実際には に接続されているはずhttp://dockerhost:8080/socket.io/です。

webpack-dev-serversocket.io接続を取得するために別のホストを使用するように指示する方法はありますか?

Github issue 63は同じ問題を参照している可能性がありますが、未解決です。

それぞれ100行未満の〜20〜30ファイルの小さなプロジェクトで、大きなmain.jsファイル（1.7mb）を生成するwebpackを取得しました。必要な依存関係は数が少なく (React、Fluxible)、理解できるすべての最適化プラグインを使用しています。

どこが間違っているのか、またはファイルのサイズをさらに改善できる場所はどこですか?

ReactJS、Webpack、Babel、および Firebase を使用してアプリを構築しています。

webpack を実行して、babel ローダーを使用してコードをバンドルすると、他の多くの行の中に次のように表示されます。

[BABEL] 注: コード ジェネレーターは、「/Users/.../myproject/node_modules/firebase/lib/firebase-web.js」のスタイル設定が最大の「100KB」を超えているため、最適化を解除しました。

次に、アプリで require('firebase') を試してからブラウザーで実行すると、ブラウザーはコンソールに次のように出力します。

PlayerStore.js:3 は、次の行がある場所です。

アプリを読み込もうとすると、このエラーの原因を知っている人はいますか? このエラーが発生したのは、Webpack で jsx-loader を使用していたのを babel に切り替えたからなのか、それとも「npm update」を実行して、使用しているパッケージの 1 つの新しいバージョンが壊れたからなのかはわかりません。

オプションの情報:このプロジェクトをmarty.jsとwebpack dev サーバーでビルドして、 react-routerからのエントリ ポイントを許可し、\ パス以外でも機能するようにしようとしています。

したがって、私はこのスタックオーバーフローの回答を一日中勉強していますが、次のコードの背後にあるロジックと、この回答が機能する理由を理解できません。

レトジはこう答えました。

これを実現するためにプロキシを設定しました：

アセット ルートを除き、すべてのルートで index.html を提供する通常のエクスプレス Web サーバーがあります。アセットの場合、リクエストは web-dev-server にプロキシされます

反応するホット エントリポイントは引き続き webpack dev サーバーを直接指すため、ホット リロードは引き続き機能します。

8081 で webpack-dev-server を実行し、8080 でプロキシを実行すると仮定しましょう。

私のコードは今このように見えますが、それを機能させるために後でmarty-expressを実装する必要があります。それを実装するには、まず retonzis の回答を理解する必要があります。

express.js ファイル

要件

プロキシー

マーティエクスプレス**

この例を理解したらすぐにそれを使用する予定です.react-routesをexpressに渡すことを願っています.**

ものを表現する

2 つのサーバー webpack-dev-server と express

私が昨日惑星火星から降りてきたように、誰かが私にこの概念を説明するのに十分親切でしょうか?

私は2つのことを理解できません：

1. プロキシが必要な理由
2. 反応ルートをエクスプレスに渡して、要求されたときに各ルートでそれらを提供する方法。 (おそらく marty -expressがその作業に役立ちますが、それがなくても手動で行うことができると思います)

ああ...このドキュメンテーションの不足地獄から抜け出すのを手伝ってください!!! そして、あなたの答えを寛大にしてください..覚えておいてください、私は昨日火星から来たばかりです。

ありがとうございました..！