Html to jade javascript

Saved searches

Use saved searches to filter your results more quickly

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.

Converts HTML to Jade template. Not perfect but useful enough for non-daily conversions.

License

donpark/html2jade

This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Sign In Required

Please sign in to use Codespaces.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching Xcode

If nothing happens, download Xcode and try again.

Launching Visual Studio Code

Your codespace will open once ready.

There was a problem preparing your codespace, please try again.

Latest commit

Git stats

Files

Failed to load latest commit information.

README.md

html2jade converts HTML into Jade format.

This module is now maintained by @aichholzer

Mostly usable but sometimes requires fixing up, usually involving conditionals and scripts indentation.

While converting a fairly complicated theme package with ~20 HTML files, I had to hand-edit just twice.

Compatible with Node.js 4.0+ (verified with v4.2.4) but likely NOT with Node.js 0.11.x, 0.12.x, and io.js.

html2jade version prior to 0.7 support OS X and Linux only.

html2jade version 0.7+ should support OS X, Windows, and Linux.

Outputs to stdout if input is URL

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

Outputs to file if input is file

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

cat mywebpage.html | html2jade - 

To generate Scalate compatible output:

html2jade --scalate http://twitter.com html2jade --scalate http://twitter.com > twitter.jade html2jade --scalate mywebpage.html html2jade --scalate public/*.html 

• -d, —double — use double quotes for attributes
• -o, —outdir — path to output generated jade file(s) to
• -n, —nspaces — the number of spaces to indent generated files with. Default is 2 spaces
• -t, —tabs — use tabs instead of spaces
• —donotencode — do not html encode characters. This is useful for template files which may contain expressions like >
• —bodyless — do not output enveloping html and body tags
• —numeric — use numeric character entities
• -s, —scalate — generate Scalate variant of jade syntax
• —noattrcomma — omit attribute separating commas
• —noemptypipe — omit lines with only pipe (‘|’) printable character

To convert raw HTML into Jade:

var html2jade = require('html2jade'); var html = "Hello World"; html2jade.convertHtml(html, <>, function (err, jade) < // do your thing >); 

To convert DOM document into Jade (client-side):

// assumes html2jade.js file has been loaded Html2Jade.convertDocument(document, <>, function (err, jade) < // do your thing >); 

Converting Mustache/Handlebars Templates

Jade is commonly used to generate HTML with embedded Mustache or Handlebars templates.

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.

There is a web version of html2jade , kindly provided by @aaronpowell.

Pascal Garber’s jade2html2jade does roundtrip from jade to HTML and back. Online demo.

Miniclip is a Linux tray app that quickly converts HTML to Jade, CSS to Stylus and JS to Coffee from clipboard.

As of version 0.4, there is a simple unit test that converts HTML files in test/data directory and compare them against Jade files in the same directory. Unit test harness requires coffee-script and mocha to be installed globally. Run the tests with command npm test .

If you’re having issues with br line-breaks which apparently Jade has some problems with, try @smaudet’s fix-breaklines branch.

About

Converts HTML to Jade template. Not perfect but useful enough for non-daily conversions.

Источник

Node.js HTML Convert html2jade: HTML to Jade conversion tool

In this tutorial you can find a node.js project called html2jade.

The project is about HTML to Jade conversion tool.

html2jade node.js project has the following dependencies.

html2jade node.js project is released under: WTFPL

Javascript Source Files

The project has 1 Javascript files.

"use strict";/* w w w . d e m o 2 s . c o m */ var R = require('ramda'); var enquote = function (quote) < return function (str) < return quote + str + quote; >; >; var safeQuote = function (str) < return R.find(function (qt) < return !str.includes(qt); >); >; var tryQuote = function (quotes) < return function (str) < var qt = safeQuote(str)(quotes); if (qt) < return enquote(qt)(str); > else < var qt_1 = quotes[0]; return enquote(qt_1)(str.replace(qt_1, '\\' + qt_1)); > >; >; var children = function (el) < return Array.from(el.childNodes); >; var pad = function (s) < return ' ' + s; >; function nodesFrom(html) < var div = document.createElement('div'); div.innerHTML = html; return children(div); > function node(n) < return n.nodeType == Node.TEXT_NODE ? textNode(n) : element(n); > function textNode(n) < return ['| ' + n.wholeText]; > function element(el) < var name = el.localName; var attrs = el.attributes; var attrR = Array.from(attrs); var attrRest = attrR.filter(function (a) < return !['id', 'class'].includes(a.name); >); var ? '#' + el.id : ''; var classes = attrs.getNamedItem('class').value.split(' ').map(function (s) < return '.' + s; >).join(''); var tag = name + id + classes; var box = attrRest.length ? [tag + '('].concat(attrRest.map(attribute).map(pad), [')']) : [tag]; var content = R.chain(node)(children(el)).map(pad); return box.concat(content); > var isBinding = function (str) < return /[()[\]]/.test(str); >; var restoreCase = function (str) < return /^[\[*]ng\w/.test(str) ? R.adjust(function (s) < return s.toUpperCase(); >, 3, str).join('') : str; >; function attribute(attr) < var name = attr.name, value = attr.value; name = restoreCase(name); var isComplex = isBinding(name); return attrK(name, isComplex) + (value ? '=' + attrV(value, isComplex) : ''); > var QUOTES = ["'", '"', '`']; var attrK = function (str, isComplex) < return isComplex ? tryQuote(QUOTES)(str) : str; >; var attrV = function (str, isComplex) < return isComplex || />/.test(str) ? tryQuote(['`', "'", '"'])(str) : tryQuote(QUOTES)(str); >; exports.toJade = function (html) < return R.flatten(nodesFrom(html).map(node)).join('\n') + '\n'; >;

Related

• Node.js HTML Convert html2bemdecl: A simple tool for converting html files into bem declarations (bemdecl.js)
• Node.js HTML Convert html2h: HTML to snabbdom hyperscript converter
• Node.js HTML Convert html2jade: A utility to convert html to jade
• Node.js HTML Convert html2jade: HTML to Jade conversion tool
• Node.js HTML Convert html2mithril: Convert raw html files to Mithril views with m() syntax
• Node.js HTML Convert html2pdf-as-a-service: Convert HTML to PDF as a Service
• Node.js HTML Convert html2pdf-cli: CLI HTML to PDF converter

demo2s.com | Email: | Demo Source and Support. All rights reserved.

Источник

Node.js HTML Convert html2jade: A utility to convert html to jade

In this tutorial you can find a node.js project called html2jade.

The project is about A utility to convert html to jade.

html2jade node.js project has the following dependencies.

html2jade node.js project is released under: ISC

Javascript Source Files

The project has 2 Javascript files.

'use strict';// w w w . de m o 2 s . c o m var jsdom = require('jsdom'); // find the target html // read the html // convert to jade // write results // specify indentation size/type /** * Convert an html string to a jade string. * @param html * @return */ var convert = function (html) < /* '' + ' ' + ' ' + ' ' + '' ================================================ 'html' + ' body' + ' div#content'; */ var jade = ''; // convert the html into a document var doc = jsdom.jsdom(html); // TODO: Parse the document now that it's in a reliable shape // and write the jade. jade = jsdom.serializeDocument(doc); return jade; >; exports.convert = convert;

'use strict';// w w w . d e mo 2 s . c o m var mocha = require('mocha'); var willy = require('willy'); var will = willy.will; var app = require('../app.js'); describe('sanity', function () < it('should exist', function () < will(app).exist(); >); >); xdescribe('finding html documents', function () < >); describe('converting html', function () < it('should return the jade equivalent', function (done) < var html = '' + ' ' + ' ' + ' ' + ''; var jade = 'html' + ' body' + ' div#content'; will(app.convert(html)).be(jade); >); >);

Related

• Node.js HTML Convert html-to: Converts html urls to other things
• Node.js HTML Convert html2bemdecl: A simple tool for converting html files into bem declarations (bemdecl.js)
• Node.js HTML Convert html2h: HTML to snabbdom hyperscript converter
• Node.js HTML Convert html2jade: A utility to convert html to jade
• Node.js HTML Convert html2jade: HTML to Jade conversion tool
• Node.js HTML Convert html2mithril: Convert raw html files to Mithril views with m() syntax
• Node.js HTML Convert html2pdf-as-a-service: Convert HTML to PDF as a Service

demo2s.com | Email: | Demo Source and Support. All rights reserved.

Источник

HTML to Jade help

I am trying to create a simple form with 2 input fields and 1 button. Here’s HTML that needs to be translated to Jade:

Please help me before I throw this computer out of the window and send a kill squad after Jade templating language developers.

I can’t post it here, indentation won’t work. Besides I just started using Express.js and Jade; I don’t even know where to start.

5 Answers 5

form(name="input", action="html_form_action.asp", method="get") | Username: input(type="text", name="user") | Password: input(type="text", name="pswd") input(type="submit", value="Submit") 

There is more elegant and correct way. Don’t forget about usability. And skip colons it’s not a paper form!

form(name="input", action="html_form_action.asp", method="get") key Username input(type="text", name="user") key Password input(type="password", name="pswd") input(type="submit", value="Submit") 

For form rendering I’m using mixins. It makes my code reusable and flexible. Look here:

mixin text(name, value, title) key=title input(type="text" name=name value=value) mixin password(name, value, title) key=title input(type="password" name=name value=value) mixin submit(name, value) input(type="submit" name=name value=value) form(name="input", action="html_form_action.asp", method="post") mixin text('user', null, 'User') mixin password('pswd', null, 'Password') mixin submit('do', 'Login') 

Источник