Different syntax highlighting on GitHub Pages and locaklly

Help
7

Did some more digging and looking at some of Jekyll’s tests, it appears the extra <div class="highlight"></div> markup is part of Rouge 2.

I have some sites that use the latest version of Jekyll (not GitHub Pages gem) and that’s the sort of markup I get.

<div class="language-js highlighter-rouge">
  <div class="highlight">
    <pre class="highlight">
      <code>...</code>
    </pre>
  </div>
</div>

So for whatever reason Rouge 2 is being engaged for you when building locally, and on GitHub Pages it’s using Rouge 1… which makes sense since they haven’t updated yet.

What’s confusing is your Gemfile.lock specifies the older version of Rouge… so not really sure how it’s using 2.