I've recently installed Jade(Pug) on a Mac OS X Yosemite.
I installed the node.js last version and then used the terminal mand: $ sudo npm install pug-cli -g
Everything was fine until i had to rendered the file. I created a test.pug file with the default pug code:
doctype html
html(lang="en")
head
title= pageTitle
script(type='text/javascript').
if (foo) bar(1 + 5)
body
h1 Pug - node template engine
#container.col
if youAreUsingPug
p You are amazing
else
p Get on it!
p.
Pug is a terse and simple templating language with a
strong focus on performance and powerful features.
and then used the terminal to render it to test it. I used the: $ pug -P test.pug and it rendered to the test.html and the output was like this:
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<script type="text/javascript">if (foo) bar(1 + 5)</script>
</head>
<body>
<h1>Pug - node template engine</h1>
<div class="col" id="container">
<p>Get on it!</p>
<p>
Pug is a terse and simple templating language with a
strong focus on performance and powerful features.
</p>
</div>
</body>
</html>
Well now when i want to auto render it and used the -watch feature:
$ pug -w test.pug it outputs like this:
<!DOCTYPE html><html lang="en"><head><title></title><script type="text/javascript">if (foo) bar(1 + 5)</script></head><body><h1>Pug - node template engine</h1><div class="col" id="container"><p>Get on it!</p><p>Pug is a terse and simple templating language with a
strong focus on performance and powerful features.</p></div></body></html>
I can't find a fix for this. To everyone else that i'm watching on youtube or other tutorials the output looks with the correct HTML structure but mine is rendered like a minified version.
What can i do to fix this and have it auto-rendered with the correct output in HTML?
I've recently installed Jade(Pug) on a Mac OS X Yosemite.
I installed the node.js last version and then used the terminal mand: $ sudo npm install pug-cli -g
Everything was fine until i had to rendered the file. I created a test.pug file with the default pug code:
doctype html
html(lang="en")
head
title= pageTitle
script(type='text/javascript').
if (foo) bar(1 + 5)
body
h1 Pug - node template engine
#container.col
if youAreUsingPug
p You are amazing
else
p Get on it!
p.
Pug is a terse and simple templating language with a
strong focus on performance and powerful features.
and then used the terminal to render it to test it. I used the: $ pug -P test.pug and it rendered to the test.html and the output was like this:
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<script type="text/javascript">if (foo) bar(1 + 5)</script>
</head>
<body>
<h1>Pug - node template engine</h1>
<div class="col" id="container">
<p>Get on it!</p>
<p>
Pug is a terse and simple templating language with a
strong focus on performance and powerful features.
</p>
</div>
</body>
</html>
Well now when i want to auto render it and used the -watch feature:
$ pug -w test.pug it outputs like this:
<!DOCTYPE html><html lang="en"><head><title></title><script type="text/javascript">if (foo) bar(1 + 5)</script></head><body><h1>Pug - node template engine</h1><div class="col" id="container"><p>Get on it!</p><p>Pug is a terse and simple templating language with a
strong focus on performance and powerful features.</p></div></body></html>
I can't find a fix for this. To everyone else that i'm watching on youtube or other tutorials the output looks with the correct HTML structure but mine is rendered like a minified version.
What can i do to fix this and have it auto-rendered with the correct output in HTML?
Share Improve this question asked Jul 11, 2016 at 9:38 boggynboggyn 551 silver badge7 bronze badges2 Answers
Reset to default 6The option you’re setting in the first variant (-P) enables output prettification. If you want it on the second variant, just add the flag: pug -P -w test.pug
From the docs:
-h, --help output usage information
-V, --version output the version number
-O, --obj <path|str> JavaScript options object or JSON file containing it
-o, --out <dir> output the piled html to <dir>
-p, --path <path> filename used to resolve includes
-P, --pretty pile pretty html output
-c, --client pile function for client-side runtime.js
-n, --name <str> the name of the piled template (requires --client)
-D, --no-debug pile without debugging (smaller functions)
-w, --watch watch files for changes and automatically re-render
-E, --extension <ext> specify the output file extension
--name-after-file name the template after the last section of the file path
(requires --client and overriden by --name)
--doctype <str> specify the doctype on the mand line (useful if it
is not specified by the template)
Check http://jade-lang./api/.
There is a pretty parameter in every API methods (--pretty in CLI) which if enabled makes Jade outputs readable (pretty) HTML.