以下の内容はhttps://uga-box.hatenablog.com/entry/2022/09/13/000000より取得しました。


【Chrome】Chrome106の Dev Toolsを使ったモダンなデバッグ

Chrome106の Dev Toolsを使ったモダンなデバッグの話

developer.chrome.com

ローカル開発していてブラウザ確認するときに、ブラウザーが読み取ったminifiedされたbundleは読みづらいので、バンドル前の状態でデバッグができるようになるオプションが追加された

[Settings] > [ Experiments ] に移動し、[ Group sources into Authored and Deployed trees ]をオンにすると試すことができる

sources タブを開くとwebpackのツリーがでている、かつ、開くとbundle前の実装に近いコードが表示された

さらにその上でフレームワークとバンドラーがつくるコードをDevTools から自動的に非表示にするオプションも追加され、それをオンにするとスタックトレースなどがみやすくなる模様

あまりピンときてないが、デバッグがやりづらいと感じたら思い出して試してみたい




以上の内容はhttps://uga-box.hatenablog.com/entry/2022/09/13/000000より取得しました。
このページはhttp://font.textar.tv/のウェブフォントを使用してます

不具合報告/要望等はこちらへお願いします。
モバイルやる夫Viewer Ver0.14