Medium とかいい記事がたくさんなのですが。

コードが見づらいときありません?

ブックマークレットで「ハイライト」します。

(() => {
  const version = '11.5.0';
  const theme = 'github-dark-dimmed';
  const prefix = `//cdnjs.cloudflare.com/ajax/libs/highlight.js/${version}`;

  const link = document.createElement('link');
  link.setAttribute('rel', 'stylesheet');
  link.setAttribute('type', 'text/css');
  link.setAttribute('href', `${prefix}/styles/${theme}.min.css`);
  document.getElementsByTagName('head')[0].appendChild(link);

  const script = document.createElement('script');
  script.setAttribute('type', 'text/javascript');
  script.setAttribute('src', `${prefix}/highlight.min.js`);
  document.getElementsByTagName('head')[0].appendChild(script);

  script.addEventListener('load', function() {
    document.querySelectorAll('pre').forEach((pre) => {
      pre.style.fontFamily = 'Courier, Menlo, Consolas, Monaco, monospace';
      pre.style.overflowX = 'scroll';
      pre.style.whiteSpace = 'pre';

      // replace medium style <br/> to LF
      pre.innerHTML = pre.innerHTML.replaceAll(/<\s*\/?br\s*[\/]?>/gi, "\n")

      if (!pre.querySelector('code')) {
        window.hljs.highlightBlock(pre);
      } else {
        window.hljs.highlightBlock(pre.querySelectorAll('code')[0]);
      }
    });
  });
})();

以下リンクをブックマークバーへドラッグしてどうぞ。

highlight-code-snippets

👉 Google「Closure Compiler」 (クロージャコンパイラ) の使い方 

関連ワード:  Javascript・WEB・おすすめ・ツール・ライブラリ・開発