初步認識pug

1、初步認識pug

1.所謂的pug就是咱們以前說的jade,也就是一種經過縮進的方式來編寫代碼的過程，在編譯的過程當中，咱們不須要考慮標籤是否閉合的問題。此外，用這種編譯方式，加快了咱們寫代碼的速度，也爲代碼複用提供了便捷。

2.在學習pug基礎語法以前，首先要了解pug的命令行的使用,例如：

doctype html

    html

    head

            title aaa

    body

在文件裏面寫上述程序，而後以xxx.pug的格式保存，再再終端命令輸入 pug xxx.pug,按下回車鍵，咱們在回到以前的項目編譯器，就會發如今編譯器內出現了與xxx同名的xxx.html文件，點開以後會發現html 基礎格式已經打印出來了。可是這裏有一個問題，基礎格式的排版並不像咱們平時書寫的格式，這裏就須要咱們在將pug格式轉化爲HTML的時候輸入命令 pug -P xxx.pug;就能夠獲得咱們想要的格式了。爲了實時自動更新出現咱們修改後的代碼樣式，咱們還能夠這樣輸入終端命令：pug -P -w xxx.pug;不想繼續更新，快捷鍵爲：ctrl+c.

3.路徑設置

若是並不但願在當前目錄下輸入編譯後的HTML文件，而是有自定義目錄的需求，則須要設置-o參數

以下設置，index.html將輸入到a目錄下面，若是a目錄不存在，則會新建a目錄：

pug index.pug -o a

4.批量編譯：

假設編譯href下的全部pug文件，則能夠這樣寫：pug href

5.結構語法：

標籤

【樹狀】

在默認狀況下，在每行文本的開頭（或者緊跟白字符的部分）書寫這個 HTML 標籤的名稱。使用縮進來表示標籤間的嵌套關係，這樣能夠構建一個 HTML 代碼的樹狀結構

ul

li Item A

li Item B

li Item C       .

持續更新，歡迎你們指教！