Why does jade ignore \n and white space?

Question

I am generating a bit of Jade based HTML with var generateCodeBlock = jade.compile('div !{text}', {pretty: true}); I want to create something like this

<div>   
    var json = {
        labelA: 'a',
        labelB: 2
       };
</div>

but when I input {text: 'var json = {\n labelA: 'a',\n labelB: 2\n };'} it ends up creating <div class="setup"> var json = { labelA: 'a', labelB: 2 };</div>. I have also tried using #{text} in jade.compile, but there was no difference. Why does jade flatten my variable input?

JSFiddle example

UPDATE: I have now tried creating a separate file for the template with

block codeBlock
    div.codeBlock
        for part in code
            div(class="#{part.className}") !{part.text}

and jade.compileFile and it is still producing var json = { labelA: 'a', labelB: 2 };

score 3 · Accepted Answer · edited May 23 '17 at 12:30

Jade does not ignore whitespace and newline. If you actually log what jade.compile($("#jadehi").html())(djson) returns you'll see that any whitespace or newlines you put in your data (like "Jade\n Test Page") will still be there.

It's HTML (or, more accurately, how browsers interpret HTML) that ignores those characters. As explained in this question:

Why does the browser renders a newline as space?

And, as suggested there, perhaps using a <pre> element will help you.

Why does jade ignore \n and white space?

1 Answers1