pug學(xué)習(xí)

wangbjun 發(fā)布于2019-08-29 16:17 / 1039人閱讀

摘要：學(xué)習(xí)由于商標版權(quán)問題，已經(jīng)改名為。是一個高性能的模板引擎，它是用實現(xiàn)的，并且可以供使用當(dāng)然還支持其他語言。

pug學(xué)習(xí)

jade(pug)
由于商標版權(quán)問題，jade已經(jīng)改名為Pug。
Pug 是一個高性能的模板引擎，它是用 JavaScript 實現(xiàn)的，并且可以供 Node 使用,當(dāng)然還支持其他語言。

文件后綴名為.pug(.jade)

pug優(yōu)點

可讀性高

靈活的縮進

塊展開

代碼默認經(jīng)過編碼處理(轉(zhuǎn)義),安全性高

運行時和編譯時上下文錯誤報告

支持命令行編譯

支持html5模式

在內(nèi)存中緩存(可選)

原生支持 Express

合并動態(tài)和靜態(tài)標簽類

過濾器

安裝

npm安裝建議安裝個nrm來進行源管理

npm install pug -g
npm install pug-cli -g

測試demo

為了方便編寫代碼,最好把編譯器的tab設(shè)置:2.

// index.jade

doctype html
html
  head
    title jade test
  body
    h2 jade study

粗暴的編譯方法

// index.html
jade testjade study

發(fā)現(xiàn)編譯后的代碼不具備可讀性

pug -- help
 Options:
     -P, --pretty           compile pretty HTML output ## 輸出漂亮結(jié)構(gòu)的HTML
    -D, --no-debug         compile without debugging (smaller functions) ## 不帶調(diào)試的編譯
    -w, --watch            watch files for changes and automatically re-render ## 對某個文件的變動保持監(jiān)控
    -E, --extension   specify the output file extension ## 指定輸出文件擴展名
    -s, --silent           do not output logs ## 不輸出日志
// 重新編譯
pug -P index.jade


  
    jade test
  
  
    jade study

自動編譯
只是為了學(xué)習(xí),這里只要設(shè)置-w -P .開發(fā)中通過打包工具來進行自動編譯.

pug pug -o . -w -P

GPU云服務(wù)器云服務(wù)器 pug html(pug) 學(xué)習(xí)機器學(xué)習(xí)學(xué)習(xí) 機器學(xué)習(xí)學(xué)習(xí)

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/113649.html

相關(guān)文章

pug學(xué)習(xí)

摘要：學(xué)習(xí)由于商標版權(quán)問題，已經(jīng)改名為。是一個高性能的模板引擎，它是用實現(xiàn)的，并且可以供使用當(dāng)然還支持其他語言。 pug學(xué)習(xí) jade(pug)由于商標版權(quán)問題，jade已經(jīng)改名為Pug。Pug 是一個高性能的模板引擎，它是用 JavaScript 實現(xiàn)的，并且可以供 Node 使用,當(dāng)然還支持其他語言。文件后綴名為.pug(.jade) pug優(yōu)點可讀性高靈活的縮進塊展開代碼默...

li21 2019-08-23 10:44 評論0 收藏0
pug學(xué)習(xí)

摘要：學(xué)習(xí)由于商標版權(quán)問題，已經(jīng)改名為。是一個高性能的模板引擎，它是用實現(xiàn)的，并且可以供使用當(dāng)然還支持其他語言。 pug學(xué)習(xí) jade(pug)由于商標版權(quán)問題，jade已經(jīng)改名為Pug。Pug 是一個高性能的模板引擎，它是用 JavaScript 實現(xiàn)的，并且可以供 Node 使用,當(dāng)然還支持其他語言。文件后綴名為.pug(.jade) pug優(yōu)點可讀性高靈活的縮進塊展開代碼默...

wangdai 2019-08-02 11:09 評論0 收藏0
初步認識pug

摘要：一初步認識所謂的就是我們之前說的也就是一種通過縮進的方式來編寫代碼的過程，在編譯的過程中，我們不需要考慮標簽是否閉合的問題。使用縮進來表示標簽間的嵌套關(guān)系，這樣可以構(gòu)建一個代碼的樹狀結(jié)構(gòu)持續(xù)更新，歡迎大家指教一、初步認識pug 1.所謂的pug就是我們之前說的jade,也就是一種通過縮進的方式來編寫代碼的過程，在編譯的過程中，我們不需要考慮標簽是否閉合的問題。此外，用這種編譯方式，加...

anRui 2019-08-29 16:17 評論0 收藏0
初步認識pug

摘要：一初步認識所謂的就是我們之前說的也就是一種通過縮進的方式來編寫代碼的過程，在編譯的過程中，我們不需要考慮標簽是否閉合的問題。使用縮進來表示標簽間的嵌套關(guān)系，這樣可以構(gòu)建一個代碼的樹狀結(jié)構(gòu)持續(xù)更新，歡迎大家指教一、初步認識pug 1.所謂的pug就是我們之前說的jade,也就是一種通過縮進的方式來編寫代碼的過程，在編譯的過程中，我們不需要考慮標簽是否閉合的問題。此外，用這種編譯方式，加...

supernavy 2019-08-02 11:09 評論0 收藏0
webpack打包多頁面

摘要：創(chuàng)建打包路徑利用這個方法，我們可以獲得需要打包的文件路徑方法中獲取文件路徑的模塊也可使用模塊，根據(jù)獲得打包的文件路徑，我們可以使用來實現(xiàn)多頁面打包。前言一開始接觸webpack是因為使用Vue的關(guān)系，因為Vue的腳手架就是使用webpack構(gòu)建的。剛開始的時候覺得webpack就是為了打包單頁面而生的，后來想想，這么好的打包方案，只在單頁面上使用是否太浪費資源了呢？如果能在傳統(tǒng)多頁...

Allen 2019-08-23 13:45 評論0 收藏0