gem-hunter
Language: JavaScript
Rollup plugin for html template to yagni-dom compatible js module compilation
Rollup plugin to convert .html or .svg files to yagni-dom compatible hyperscript dialect ES6 modules (uses yagni-parser under the hood).
<!-- layout.html --> <div class="body"> <div class="sidebar">Sidebar</div> <div class="content">Hello, {{ ctx.username }}!</div> </div>
import { view as layoutView } from './html/layout.html'; const tree = layoutView({username: 'John Smith'}); console.log(tree); // tree is an object of the following structure, suitable for render by // yagni-dom render function // const tree = { // tagName: 'div', // attrs: {'class': 'body'}, // props: {}, // children: [ // { // tagName: 'div', // attrs: {'class': 'sidebar'}, // props: {}, // children: ['Sidebar'] // }, // { // tagName: 'div', // attrs: {'class': 'content'}, // props: {}, // children: ['Hello, John Smith!'] // } // ] // };
For an example of generated javascript code please check yagni-parser.
Using npm:
$ npm install --save-dev @yagni-js/rollup-plugin-yagni @yagni-js/yagni-dom @yagni-js/yagni
Using yarn:
$ yarn add -D @yagni-js/rollup-plugin-yagni @yagni-js/yagni-dom @yagni-js/yagni
// rollup.config.js import yagni from '@yagni-js/rollup-plugin-yagni'; export default { entry: 'src/main.js', dest: 'dist/bundle.js', format: 'iife', plugins: [ yagni({ // All html/svg files will be parsed by default, // but you can also specifically include/exclude files include: ['html/**', 'svg/**'], exclude: ['node_modules/**'] }) ] };