1.はじめに
djangoアプリの開発中にコメントアウトで引っかかって手間取ったのでまとめます.
2.ブラウザ側で無効になるコメントアウト
htmlやjsのコメントアウトがこれに当たります.このコメントアウトはブラウザの検証機能から見えるので残すときには注意が必要です.
<html>
<body>
<!--コメントアウト-->
</body>
<script>
// コメントアウト
/* コメントアウト */
</script>
</html>
3.テンプレートエンジン側で無効になるコメントアウト
Djangoのテンプレートタグなどを使ってもコメントアウトすることができます.こちらはテンプレートエンジンで無効になるのでブラウザの検証機能から見えるhtmlやjsのソース内から見ることができません.
<html>
<body>
{% comment %} コメントアウト {% endcomment %}
{{# コメントアウト #}}
</body>
</html>
4.引っかかったポイント
Djangoアプリでは,テンプレートエンジンで処理 → ブラウザでレンダリングの順番で処理が走ります.
つまり,以下のようなコメントアウトの場合は想定する結果となりません.
<html>
<body>
<!-- {% if not "param" == "param" %} -->
<div>
せいじょうにひょうじされた
<div>
<!-- {% endif %} -->
</body>
</html>
この場合テンプレートエンジンで"param","param"の比較文がまず動いて,そのあとにブラウザでのレンダリング処理が走るので実際には以下のようなhtmlが読み込まれます.
<html>
<body>
<!-- -->
<div>
せいじょうにひょうじされた
<div>
<!-- -->
</body>
</html>
djangoタグによるコメントアウトを使えば正常に読み込まれます.
<html>
<body>
{% comment %} {% if not "param" == "param" %} {% endcomment %}
<div>
せいじょうにひょうじされた
<div>
{% comment %} {% endif %} {% endcomment %}
</body>
</html>
上記がブラウザでレンダリングされる際にはテンプレートエンジンでコメント文が無効になるので以下のように読み込まれます.
<html>
<body>
<div>
せいじょうにひょうじされた
<div>
</body>
</html>
5. おわりに
わりと初歩的なことだとは思いますが,数百行以上のhtmlファイルで上記のミスをしてしまうと探すのに苦労します.htmlのコメントアウトとかを使ってブロック単位でまとめてコメントアウトする癖がある方は注意してください！（実体験