問題タブ [webpack-hmr]
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.
performance - Webpack ホット モジュール置換を使用して Sass コンパイルを最適化する
Webpack でホット モジュール置換を使用する場合、Sass ファイルのコンパイル パフォーマンスに影響を与える要因は何ですか?
現在、複数のディレクトリに整理された多くのSassファイルがあります。
各ディレクトリには、内部のファイルをロードするマニフェストがあり、すべてのマニフェストとすべてのベンダー ライブラリをロードするエントリ ポイントはmain.scss.
現在、アプリケーション エントリポイント ( app.js)からこのファイルが必要です。
HMR は現在動作していますが、変更されたファイルを保存してからブラウザで変更が更新されるまでには長い遅延があります。
私のサスローダー：
開発ツール構成:
HMR の更新速度に影響を与える要因は何ですか?
reactjs - ソースマップを React Css モジュールで動作させるには?
react-css-modules、webpack、およびHot Module Replacementを使用して React プロジェクトをセットアップしようとしています。すべてが魅力的に機能していますが、CSS ソースマップを機能させることができません。
このガイドに従って、HMR を機能させました。これには、Webpack が css ファイルをディスクに書き込んだ後に css ファイルを更新するための BrowserSync セットアップが含まれます。
私は（react-css-modulesで提案されているように）ExtractTextPluginすべてのcssを抽出するために使用します：
しかし、ここで提案されているように、これをソースマップに変更すると
"root" CSS module is undefined.ブラウザのコンソールに次のエラーが表示されます。
サンプル リポジトリはこちらにありますが、開発に使用している完全な webpack 構成は次のとおりです。
ソースマップを機能させるには?
webpack - webpack-dev-server のビルドに時間がかかりますか?
インライン webpack-dev-server を実行するスクリプトがあります。
最初のビルドでは、すべてのコア パッケージをプルするのに長い時間がかかりますが、問題ありません。残念ながら、反応コンポーネントの変更にはしばらく時間がかかります。反応、反応mdl、およびローダーと同様のその他のコアコンポーネントの構築を回避する方法はありますか?機能を除外しますか?
ありがとうございました！
javascript - 反応、タイプスクリプト、およびHMRを使用したWebPackセットアップの作業
Typescript (.tsx) で記述された ReactJs コンポーネントで WebPack を動作させ、WebPack のホット モジュール置換を利用しようとしています。これを行う方法を説明するいくつかのレシピを見つけましたが、それらはすべて同じ問題を抱えているようです.renderメソッドで使用するコンポーネントクラスにフィールドがある場合、コードでそれを変更するとHMRが適切にトリガーされません. 、例えば
コード内の値を変更するlabelと、ページは更新されません。最初に見つけたスターター プロジェクトで GitHub に問題を作成し、さらに多くのプロジェクトを試しましたが、すべてこの問題が発生しています。これは大きな問題です。ページが更新されるかどうか確信が持てない場合、HMR 全体が無意味になります。また、これはバニラの .jsx コンポーネントで正常に機能することに注意してください。
誰かがこれを機能させる方法を持っていますか? どんな方向性でも大歓迎です。
socket.io - 独自の socket.io サーバーをプロキシするときに webpack のホット モジュール置換 (react-hot-loader) を機能させる方法
socket.io を使用するノード エクスプレス アプリがあります。このアプリは、クライアント側の反応アプリ (ノード アプリのソケット コードと通信する) でホット モジュール置換を使用したいので、webpack の開発サーバーを介してプロキシされます。
ただし、リスナーを追加するsocket.ioと、ホットモジュールの交換が中断されます。hmrリスナーではなく、リスナーがメッセージを受信しているためだと思いますか?
問題は、ホットロードされるファイルを保存すると、代わりにクロム開発ツールで次のようになり、ホットロードが発生しないことです:
( の本体400 (Bad Request)は次のとおりです。
これを正しく設定する方法を知っている人はいますか？
MYwebpack.config.jsは現在:
css - webpack style-loader HMR ソースマップが更新されない
HMR が機能しており、スタイルを変更するとページが自動的に更新されます。ただし、HMR は自分のスタイルのソース マップを更新していないため、要素を調べているときにスタイルをクリックすると、ページが最初に読み込まれたときのファイルのバージョンしか表示されません。
私のローダーは次のとおりです。
そして、私はdevtoolなるように構成しましたcheap-module-eval-source-map。
ソースマップを変更で更新するにはどうすればよいですか?