フロントエンド開発では、ブラウザーでのデバッグ、特に一部のスタイルの変更が必要になることがよくあります。最初にブラウザー要素でデバッグしてからローカル ファイルにコピーすると、実際にアウトになります。
Chrome ブラウザのワークスペース機能は、同期変更を実現するのに完全に役立ちますが、いくつかの設定が必要です。さて、早速、次の例を見てみましょう:
1. Chrome でローカル HTML ファイルを開き、F12 キーを押してデバッガーを開きます
2. 右上隅の選択メニューで設定を選択します
3左側のメニュー バーでワークスペースを選択し、フォルダーの追加をクリックして、プロジェクト ディレクトリが存在するフォルダーを追加します
4. パスは上記の太字のパスと一致し、その後にスラッシュ
5. セットアップ後、要素パネルに戻って、好きなだけスタイルをデバッグします。奇跡が起こるでしょう!
デバッグ前に要素内のスタイルをデバッグします
デバッグ前にエディターで開かれたローカルスタイルファイルをデバッグします
デバッグ後
ワークスペースを使用すると、母はもう私がスタイルをデバッグすることを心配する必要はありませんそして前へ。