はてなブログで Prism.js を使う

はてなブログのシンタックスハイライトに JSX / TSX が対応してなかったり、
C# の async/await 当たりが永遠に真っ白だったりしてつらかったので、 Prism.js を導入しました。

導入方法は簡単で、こんなコードを設定の「 head に要素を追加」の部分に付け足して、

<script src="https://cdn.jsdelivr.net/npm/prismjs@1.17.1/components/prism-core.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.17.1/plugins/autoloader/prism-autoloader.min.js"></script>
<script>
  document.addEventListener("DOMContentLoaded", (event) => {
    document.querySelectorAll("pre.code").forEach((block) => {
      block.className = "code language-" + block.dataset.lang;

      window.Prism.highlightElement(block);
    });
  });
</script>