問題は、CSS マッピングを Chrome (v38、OS X) の Compass プロジェクトで動作させようとしているため、ページをリロードする必要なく CSS をリロードすることです。
このhttps://developer.chrome.com/devtools/docs/css-preprocessorsと、このhttp://www.sitepoint.com/using-source-maps-debug-sass-chrome/に従いました
私は完全に作業中のコンパスプロジェクトを持っており、を使用してコンパイルしてcompass watch
います。
Config.rb
に追加sourcemap = true
し、.map
ファイルが正常に作成されました。
サイトを読み込むと.map
、コンソールの [ネットワーク] タブに読み込まれたファイルが表示されます (ステータス コード 200)
Enable CSS source maps
Chromeの設定でAuto-reload generated CSS
もオンになっています。
しかし、CSS の変更を再コンパイルすると、DevTools にもページにも表示されません。ただし、DevTools を再度開くと、[スタイル] タブに変更が表示されますが、ページには適用されません。
要約すると、次のようになります。
- コンパスのコンパイルなどに問題はありません。
.map
ファイルはコンパイルされ、200 OK 応答で HTTP サーバーを介してロードされます.scss
スタイルインスペクターで参照を見ることができます。だからChromeは私のファイルbody {...} style.scss:18
と通信しました.map
- SCSS をコンパイルすると、再度開いたときにのみ DevTools に変更が反映されます
- 再度開いた後、[スタイル] タブで CSS の変更を確認できますが、ページに適用されていません
ここで問題になる可能性のあるアイデアはありますか? ありがとう