jstransformers / jstransformer

Normalize the API of any JSTransformer.
http://npm.im/jstransformer
MIT License
153 stars 12 forks source link

mich-to-html #198

Open tunnckoCore opened 7 years ago

tunnckoCore commented 7 years ago

https://github.com/tunnckoCore/mich-to-html

Just tiny and naive implementation of virtual dom to html string. I think is pretty enough. I'll going to add self-closing tags support soon. It is just a matter of few lines.

Using https://github.com/tunnckoCore/mich-h you can create HAST-compliant virtual trees. Then passing it to mich-to-html you get a HTML string. You can also write JSX instead of hyperscript compatible syntax if you use the jsx pragma. Actually mich-h is fully compatible with hyperscript and even have a bit better parsing of css selectors (the first argument) through mich-parse-selector

/** @jsx h */
const h = require('mich-h')
const toHtml = require('mich-to-html')

const hi = 'Hello World'
const tree = <h1 id="hero" className="big header">{hi}</h1>

console.log(toHtml(tree))
// => '<h1 id="hero" class="big header">Hello World</h1>'

or without breaking the javascript

const h = require('mich-h')
const toHtml = require('mich-to-html')

const tree = h('h1.big#hero.header', 'Hello World')

const html = toHtml(tree)
console.log(html)
// => '<h1 id="hero" class="big header">Hello World</h1>'

All mich related things are just part of the upcoming chika (readme isn't real, just scaffolded it to see how it would look :) badges aren't real, nor examples)

tunnckoCore commented 7 years ago

I just feel that the stuff is would go more crazy and crazy, when publish rollup-plugin-jstransformer. Just imagine UI lib based on Rollup and JSTransformers. It will be abled to compile chika/mich-h components with rollup through JSTransformer. Kinda what svelte does, haha.