Django4.0のDebug=FalseでCSS出なくて500エラーになる問題

Django4.0になってから、なぜかAPP_DIRS=Trueにしても各アプリ下でtemplateが使えなかったり、markdownxがDjango3.版まで非推奨の構成を使っていたせいで現在使えなかったり(投稿日を確認ください。)して過去の記事が塵と化していましたが、この問題は全然別の場所でした。すぐ自分以外に原因を求めるのはやはり悪と。

バージョンや環境

筆者のバージョン・環境はご覧のとおりです。

ローカル
・WSL2
・Django4.0
・pip3 venv仮想環境
デプロイ先
・Heroku
確認
・Chrome

つまり今回はHerokuデプロイの記事でもあります。

Herokuデプロイの方法についてやDjangoプロジェクトの作り方は省かれます。ご了承ください。

参考資料

まずCSSの読み込みエラーにたどり着いたのはこちらのおかげです。

次に、ひとまず500エラーを解決させてもらえた記事がこちらです。

これで動きました。本当に助かりました。

ただ、開発者ツール(F12)のConsoleを見るとCSSが読めていません。また、実は以前のデプロイ時、CSSはしっかりと適用されていたんですよね。そこで、以前の違いなどを確認しながら解決に向かいました。

結論

誰も私の2時間と睡眠時の思いつきなど興味ないと思うので、結論だけ。

cssの読み込みのURLが間違っていました!!

before

<link rel="stylesheet" href="{% static '/<app_name>/css/style.css' %}">

after

<link rel="stylesheet" href="{% static '<app_name>/css/style.css' %}">

(よくあることですが、こういうところでの<>は「あなたの環境に置き換えてください」という意味なので、"<"と">"が必要というわけではありません。)

ほぼ違いは無いのですが、<app_name>の前に"/"が有るか無いかが違います。

"/"が有ると死にます。無いとHerokuがルーティングを勝手にやってくれます。実は本や公式のチュートリアルは"/"入れていないんですよね。徹底してますね。尊敬します。

これは逆にDEBUG=True時にどうして動くのかが余計に分からないのですが...

最後に

参考記事の筆者様方、ありがとうございました。

また、最後までお読み頂きありがとうございました。