doctype宣言(文書宣言)はしていますか?
試しに下記のコードを書いて試してみました。
index.js
JavaScript
1const pug = require('pug')
2
3const template = `
4doctype html
5body
6 h1 test
7 p
8 | test1
9 br
10 | test2
11`
12
13const option = {
14 pretty: ' '
15}
16const data = {}
17const html = pug.compile(template, option)(data)
18console.log(html)
Bash
1$ npm init --yes
2
3$ npm install pug
4
5$ node index.js
6<!DOCTYPE html>
7<body>
8 <h1>test</h1>
9 <p>test1<br>test2</p>
10</body>
質問者さんが求めている<br>
が帰ってきました。
次にindex.js内部のhtmlからdoctype html
を削って試してみます。
Bash
1$ node index.js
2<body>
3 <h1>test</h1>
4 <p>test1<br/>test2</p>
5</body>
あら、今度は<br/>
になりましたね。
これにはちゃんとした理由があります。
HTML5は<br/>
・<br>
の両方を正式なタグとして認識します。
XHTMLは<br/>
しか正式なタグとして認識しませんので<br>
は文書の構文違反として取り扱われます。
PugとしてはHTML5かXHTMLかよくわからない場合は、
どちらでも対応出来る<br/>
にするかという設計思想のようです。
なので<br>
が欲しければ私はHTML5をコンパイルしているんだと明示しなければなりません。
ちゃんと1行目でドキュメントタイプ宣言していれば大丈夫でしょう。
設定出来るオプション等は無いのでしょうか?
Pug公式の方のリファレンスを見ました。
そこにはdoctypeというオプションが存在しているようです。
早速適用してみます。
JavaScript
1const pug = require('pug')
2
3const template = `
4body
5 h1 test
6 p
7 | test1
8 br
9 | test2
10`
11
12const option = {
13 pretty: ' ',
14 doctype: 'html'
15}
16const data = {}
17const html = pug.compile(template, option)(data)
18console.log(html)
Bash
1$ node index.js
2<body>
3 <h1>test</h1>
4 <p>test1<br>test2</p>
5</body>
明示的にHTMLだよと教えてあげると<br>
を吐き出すようですね。
gulp-pugの方は調べていませんが、
gulp-xxxの内、大抵のライブラリはこのオプションを右から左へ受け渡しているだけなので、
doctype: 'html'
というオプションを追加して試してみてはどうでしょうか?
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2018/01/23 05:07