html 转换为jade,html转jade.htm

最新推荐文章于 2024-03-14 11:43:29 发布

岛七

最新推荐文章于 2024-03-14 11:43:29 发布

阅读量282

点赞数

文章标签： html 转换为jade

html转jade

style="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 10px; PADDING-TOP: 20px; FONT: 700 24px/25px 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px; BORDER-LEFT: 0px; WIDOWS: 1; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">

style="BOX-SIZING: border-box; TEXT-DECORATION: none; FONT-WEIGHT: 700; COLOR: ; OUTLINE-WIDTH: medium; OUTLINE-STYLE: none; OUTLINE-COLOR: invert; -webkit-tap-highlight-color: transparent"

href="https://www.npmjs.com/package/html2jade#install">Install

npm install -g html2jade

style="BOX-SIZING: border-box; TEXT-DECORATION: none; FONT-WEIGHT: 700; COLOR: ; OUTLINE-WIDTH: medium; OUTLINE-STYLE: none; OUTLINE-COLOR: invert; -webkit-tap-highlight-color: transparent"

href="https://www.npmjs.com/package/html2jade#command-line-usage">Command-line

Usage

style="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; FONT: 16px/25px 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px 0px 15px; BORDER-LEFT: 0px; WIDOWS: 1; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">Outputs

to stdout if input is URL

html2jade http://twitter.com

html2jade http://twitter.com > twitter.jade

style="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; FONT: 16px/25px 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px 0px 15px; BORDER-LEFT: 0px; WIDOWS: 1; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">Outputs

to file if input is file

html2jade mywebpage.html # outputs mywebpage.jade

html2jade public/*.html # converts all .html files to .jade

style="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; FONT: 16px/25px 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px 0px 15px; BORDER-LEFT: 0px; WIDOWS: 1; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">Convert

HTML from

style="BOX-SIZING: border-box; BORDER-TOP: 0px; FONT-FAMILY: Consolas, 'Liberation Mono', Menlo, Monaco, Courier, monospace; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; BORDER-BOTTOM: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; PADDING-LEFT: 0px; MARGIN: 0px; BORDER-LEFT: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(245,245,245); font-stretch: inherit">stdin

cat mywebpage.html | html2jade -

style="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; FONT: 16px/25px 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px 0px 15px; BORDER-LEFT: 0px; WIDOWS: 1; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">To

generate

style="BOX-SIZING: border-box; TEXT-DECORATION: none; FONT-WEIGHT: 600; COLOR: rgb(203,56,55); OUTLINE-WIDTH: medium; OUTLINE-STYLE: none; OUTLINE-COLOR: invert; -webkit-tap-highlight-color: transparent"

href="http://scalate.fusesource.org/">Scalate

class=Apple-converted-space>

compatible output:

html2jade --scalate http://twitter.com

html2jade --scalate http://twitter.com > twitter.jade

html2jade --scalate mywebpage.html

html2jade --scalate public/*.html

style="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 10px; PADDING-TOP: 20px; FONT: 700 20px/1 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px; BORDER-LEFT: 0px; WIDOWS: 1; DISPLAY: block; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">

style="BOX-SIZING: border-box; TEXT-DECORATION: none; FONT-WEIGHT: 700; COLOR: ; OUTLINE-WIDTH: medium; OUTLINE-STYLE: none; OUTLINE-COLOR: invert; -webkit-tap-highlight-color: transparent"

href="https://www.npmjs.com/package/html2jade#command-line-options">Command-line

Options

style="LIST-STYLE-TYPE: none; BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; FONT: 16px/25px 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px 0px 20px 20px; BORDER-LEFT: 0px; WIDOWS: 1; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">

style="LIST-STYLE-TYPE: disc; BOX-SIZING: border-box; FONT-SIZE: 16px; BORDER-TOP: 0px; FONT-FAMILY: inherit; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; BORDER-BOTTOM: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; PADDING-LEFT: 0px; MARGIN: 0px; BORDER-LEFT: 0px; PADDING-RIGHT: 0px; font-stretch: inherit">

--double

class=Apple-converted-space>

- 属性使用双引号(默认是单引号)

--outdir <dir>

jade文件输出路径

--nspaces <n>

缩进空格数(默认2个空格)

--tabs

- 使用tab缩进

class=Apple-converted-space>

- 解决中文字符乱码

class=Apple-converted-space>

- do not output enveloping html and

body tags

class=Apple-converted-space>

- use numeric character entities

--scalate

- generate

class=Apple-converted-space>

href="http://scalate.fusesource.org/">Scalate

class=Apple-converted-space>

variant of jade syntax

class=Apple-converted-space>

- omit attribute separating

commas

class=Apple-converted-space>

- omit lines with only pipe ('|')

printable character

style="BOX-SIZING: border-box; TEXT-DECORATION: none; FONT-WEIGHT: 700; COLOR: ; OUTLINE-WIDTH: medium; OUTLINE-STYLE: none; OUTLINE-COLOR: invert; -webkit-tap-highlight-color: transparent"

href="https://www.npmjs.com/package/html2jade#programmatic-usage-0-0-7">Programmatic

Usage (>= 0.0.7)

style="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; FONT: 16px/25px 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px 0px 15px; BORDER-LEFT: 0px; WIDOWS: 1; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">To

convert raw HTML into Jade:

var html2jade = require('html2jade');

var html = "<html><body>Hello World</body></html>";

html2jade.convertHtml(html, {'tabs':true}, function (err, jade) {

// do your thing

});

style="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; FONT: 16px/25px 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px 0px 15px; BORDER-LEFT: 0px; WIDOWS: 1; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">To

convert DOM document into Jade (client-side):

// assumes html2jade.js file has been loaded

Html2Jade.convertDocument(document, {'tabs':true}, function (err, jade) {

// do your thing

});

style="BOX-SIZING: border-box; TEXT-DECORATION: none; FONT-WEIGHT: 700; COLOR: ; OUTLINE-WIDTH: medium; OUTLINE-STYLE: none; OUTLINE-COLOR: invert; -webkit-tap-highlight-color: transparent"

href="https://www.npmjs.com/package/html2jade#converting-mustache-handlebars-templates">Converting

Mustache/Handlebars Templates

style="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; FONT: 16px/25px 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px 0px 15px; BORDER-LEFT: 0px; WIDOWS: 1; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">Jade

is commonly used to generate HTML with embedded Mustache or Handlebars

templates.

style="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; FONT: 16px/25px 'Source Sans Pro', 'Lucida Grande', sans-serif; PADDING-LEFT: 0px; MARGIN: 0px 0px 15px; BORDER-LEFT: 0px; WIDOWS: 1; LETTER-SPACING: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-stroke-width: 0px; font-stretch: inherit">Be

sure to use version 0.8+ if you use template expressions in element IDs or CSS

class names to avoid generating invalid Jade files.

一键复制

编辑

Web IDE

原始数据

按行查看

历史

岛七

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html 转换为jade,html转jade.htm

html转jadehtml转jadestyle="BOX-SIZING: border-box; BORDER-TOP: 0px; BORDER-RIGHT: 0px; VERTICAL-ALIGN: baseline; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: 0px; TEXT-TRANSFORM: none; COLOR: ...
复制链接

扫一扫