ローカル環境でCSSが反映されない時に見直すべきhttpdの設定

ローカル環境で CSS の内容を変更した時、変更内容が反映されない場合があります。

css の構文間違ってたかなぁと Chrome の検証ツールで確認しても、変更したはずの記述が何も出てこない。

ブラウザのキャッシュをクリアしてもダメ。

これは困ったなぁと。。( ・(ｪ)・) ｸﾏｯﾀ

過去のノートを見直したら解決方法のメモがありました。

偉いぞ！過去の俺！

というわけで、いつでも見返せるようにここで綺麗にまとめておきます。

原因

開発環境に Apache を使用している場合、httpd の設定に EnableSendfile という機能があります。

一度読み込んだ静的なファイル（css とか html、js）は再度読み込まずに、キャッシュ内容を送る機能です。

EnableSendfile とは

Apache の機能の一つ 一度読み込んだ静的なファイル（HTML/CSS, JavaScript）は、再度読み込まずにキャッシュ内容を送る

本番環境だとリクエスト数を減らすことができるので便利なのですが、開発環境では頻繁にファイルを更新するので必要ないです。

初期状態ではこの EnableSendfile がオンになっているので、オフにしてさしあげます。

EnableSendfile 機能を off にする

Apache の設定は/etc/httpd/conf/httpd.conf にあります。

vim か vi で httpd.conf を開いて、EnableSendfile の行を「off」に修正し、保存。

vi /etc/httpd/conf/httpd.conf

設定後は httpd の再起動を忘れずに。

systemctl restart httpd

Nginx の場合

Nginx にも Apache と同様の機能があり、/etc/nginx/nginx.conf で設定を変更できるので、ファイルを開いて「sendfile」の項目を on から off にします。

vi /etc/nginx/nginx.conf

まとめ

サクサク変更分が反映されるようになりました。

やったね！