ローカル環境で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で設定を変更できます。

vi /etc/nginx/nginx.conf

「sendfile」の項目をonからoffにします。

まとめ

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

やったね！