Skip to main content

Error: uninitialized constant HTML::Pipeline::SyntaxHighlightFilter::Pygments when installing html-pipeline

General • Asked by Jay Killeen

I am getting an error:
uninitialized constant HTML::Pipeline::SyntaxHighlightFilter::Pygments.

my Gemfile shows:

# markdown in comments
gem 'html-pipeline', '~> 1.11.0'
gem 'github-linguist', '~> 4.8', '>= 4.8.4'
gem 'github-markdown', '~> 0.6.7'
gem 'gemoji', '~> 2.1.0'
gem 'sanitize', '~> 3.0.3'

and in application_helper.rb I have:

def markdown(content)
  pipeline_context = {gfm: true, asset_root: "https://a248.e.akamai.net/asse..."}
  pipeline = HTML::Pipeline.new [
    HTML::Pipeline::MarkdownFilter,
    HTML::Pipeline::EmojiFilter,
    HTML::Pipeline::SanitizationFilter,
    HTML::Pipeline::SyntaxHighlightFilter
  ], pipeline_context
  pipeline.call(content)[:output].to_s.html_safe
end

If I add

gem 'pygments.rb', '~> 0.6.3' to my Gemfile I can get it going but I thought pygments was a dependency of github-linguist.

Also the html syntax highlighting doesn't even seem to work when it is up and running. Is there a place where I can set the highlighting theme??


Hmm this might be an issue with rails -v 5.0.0beta4


Any reason you're using an old version of html-pipeline? It looks like 2.4.0 is the latest version. That is probably the source of the issues, just mismatched versions. If you use an old html-pipeline, you'll probably need equivalent versions of the other gems from around the same time.


I have had a read of the issues and appears that the html-pipeline gem is not yet compatible with Rails5 so I'll probably have to wait a bit more.


Jay did you get html-pipeline/SyntaxHighlightFilter gem to work with Rails 5?


I was hable to figure out how to add the html syntax highlighting.

In turn, the actual syntax highlighting is handled by pygments.rb. Pygments.rb can generate the styles. The following generates the CSS for HTML formatted code:

❯ irb
>> require 'pygments'
=> true
>> Pygments.css('.highlight')
=> ".highlight .hll { background-color: #ffffcc }\n.highlight  { background: #f8f8f8..."

Then just copy and past the code into your css file.

Here my formated style:

.highlight .hll {
     background-color: #ffffcc
 }
.highlight {
     background: #f8f8f8;
 }
.highlight .c {
     color: #408080;
     font-style: italic
 }
 /* Comment */

.highlight .err {
     border: 1px solid #FF0000
 }
 /* Error */

.highlight .k {
     color: #35bb71;
     font-weight: bold
 }
 /* Keyword */

.highlight .o {
     color: #666666
 }
 /* Operator */

.highlight .ch {
     color: #408080;
     font-style: italic
 }
 /* Comment.Hashbang */

.highlight .cm {
     color: #408080;
     font-style: italic
 }
 /* Comment.Multiline */

.highlight .cp {
     color: #BC7A00
 }
 /* Comment.Preproc */

.highlight .cpf {
     color: #408080;
     font-style: italic
 }
 /* Comment.PreprocFile */

.highlight .c1 {
     color: #408080;
     font-style: italic
 }
 /* Comment.Single */

.highlight .cs {
     color: #408080;
     font-style: italic
 }
 /* Comment.Special */

.highlight .gd {
     color: #A00000
 }
 /* Generic.Deleted */

.highlight .ge {
     font-style: italic
 }
 /* Generic.Emph */

.highlight .gr {
     color: #FF0000
 }
 /* Generic.Error */

.highlight .gh {
     color: #000080;
     font-weight: bold
 }
 /* Generic.Heading */

.highlight .gi {
     color: #00A000
 }
 /* Generic.Inserted */

.highlight .go {
     color: #888888
 }
 /* Generic.Output */

.highlight .gp {
     color: #000080;
     font-weight: bold
 }
 /* Generic.Prompt */

.highlight .gs {
     font-weight: bold
 }
 /* Generic.Strong */

.highlight .gu {
     color: #800080;
     font-weight: bold
 }
 /* Generic.Subheading */

.highlight .gt {
     color: #0044DD
 }
 /* Generic.Traceback */

.highlight .kc {
     color: #35bb71;
     font-weight: bold
 }
 /* Keyword.Constant */

.highlight .kd {
     color: #35bb71;
     font-weight: bold
 }
 /* Keyword.Declaration */

.highlight .kn {
     color: #35bb71;
     font-weight: bold
 }
 /* Keyword.Namespace */

.highlight .kp {
     color: #35bb71
 }
 /* Keyword.Pseudo */

.highlight .kr {
     color: #35bb71;
     font-weight: bold
 }
 /* Keyword.Reserved */

.highlight .kt {
     color: #B00040
 }
 /* Keyword.Type */

.highlight .m {
     color: #666666
 }
 /* Literal.Number */

.highlight .s {
     color: #f37171
 }
 /* Literal.String */

.highlight .na {
     color: #7D9029
 }
 /* Name.Attribute */

.highlight .nb {
     color: #35bb71
 }
 /* Name.Builtin */

.highlight .nc {
     color: #367af7;
     font-weight: bold
 }
 /* Name.Class */

.highlight .no {
     color: #e2854e
 }
 /* Name.Constant */

.highlight .nd {
     color: #AA22FF
 }
 /* Name.Decorator */

.highlight .ni {
     color: #999999;
     font-weight: bold
 }
 /* Name.Entity */

.highlight .ne {
     color: #D2413A;
     font-weight: bold
 }
 /* Name.Exception */

.highlight .nf {
     color: #367af7
 }
 /* Name.Function */

.highlight .nl {
     color: #A0A000
 }
 /* Name.Label */

.highlight .nn {
     color: #367af7;
     font-weight: bold
 }
 /* Name.Namespace */

.highlight .nt {
     color: #35bb71;
     font-weight: bold
 }
 /* Name.Tag */

.highlight .nv {
     color: #19177C
 }
 /* Name.Variable */

.highlight .ow {
     color: #AA22FF;
     font-weight: bold
 }
 /* Operator.Word */

.highlight .w {
     color: #bbbbbb
 }
 /* Text.Whitespace */

.highlight .mb {
     color: #666666
 }
 /* Literal.Number.Bin */

.highlight .mf {
     color: #666666
 }
 /* Literal.Number.Float */

.highlight .mh {
     color: #666666
 }
 /* Literal.Number.Hex */

.highlight .mi {
     color: #666666
 }
 /* Literal.Number.Integer */

.highlight .mo {
     color: #666666
 }
 /* Literal.Number.Oct */

.highlight .sa {
     color: #f37171
 }
 /* Literal.String.Affix */

.highlight .sb {
     color: #f37171
 }
 /* Literal.String.Backtick */

.highlight .sc {
     color: #f37171
 }
 /* Literal.String.Char */

.highlight .dl {
     color: #f37171
 }
 /* Literal.String.Delimiter */

.highlight .sd {
     color: #f37171;
     font-style: italic
 }
 /* Literal.String.Doc */

.highlight .s2 {
     color: #f37171
 }
 /* Literal.String.Double */

.highlight .se {
     color: #BB6622;
     font-weight: bold
 }
 /* Literal.String.Escape */

.highlight .sh {
     color: #f37171
 }
 /* Literal.String.Heredoc */

.highlight .si {
     color: #BB6688;
     font-weight: bold
 }
 /* Literal.String.Interpol */

.highlight .sx {
     color: #35bb71
 }
 /* Literal.String.Other */

.highlight .sr {
     color: #BB6688
 }
 /* Literal.String.Regex */

.highlight .s1 {
     color: #f37171
 }
 /* Literal.String.Single */

.highlight .ss {
     color: #19177C
 }
 /* Literal.String.Symbol */

.highlight .bp {
     color: #35bb71
 }
 /* Name.Builtin.Pseudo */

.highlight .fm {
     color: #367af7
 }
 /* Name.Function.Magic */

.highlight .vc {
     color: #19177C
 }
 /* Name.Variable.Class */

.highlight .vg {
     color: #19177C
 }
 /* Name.Variable.Global */

.highlight .vi {
     color: #19177C
 }
 /* Name.Variable.Instance */

.highlight .vm {
     color: #19177C
 }
 /* Name.Variable.Magic */

.highlight .il {
     color: #666666
 }
 /* Literal.Number.Integer.Long */

Login or Create An Account to join the conversation.

Subscribe to the newsletter

Join 27,623+ developers who get early access to new screencasts, articles, guides, updates, and more.

    By clicking this button, you agree to the GoRails Terms of Service and Privacy Policy.

    More of a social being? We're also on Twitter and YouTube.