"riotify" is a browserify transformer for riot ".riot" files.
If you are using Riot.js < 4.0.0 please check the v3 branch
$ npm install riotify @riotjs/compiler -D
This module is meant to be used together with browserify or module-deps:
Either of the two commands below result creates the same result:
$ browserify -t riotify app.js $ module-deps -t riotify app.js | browser-pack
Example app.js
:
const Todo = require('./todo.riot').default const {component} = require('riot') component(Todo)(document.getElementById('todo'))
Example todo.riot
:
<todo> <div each={ item in items }> <h3>{ item.title }</h3> </div> <script> // a tag file can contain any JavaScript, even require() const resources = require('../resources.json') export default { items: [ { title: resources.en.first }, { title: resources.en.second } ] } </script> </todo>
Note that your tag files actually need to have the extension ".riot".
This plugin can give riot's compile options.
$ browserify -t [ riotify --ext html ] app.js
You can also configure it in package.json
{ "name": "my-package", "browserify": { "transform": [ ["riotify", { "ext": ".html" }], ] } }
String
See more: https://github.com/riot/compiler
const gulp = require('gulp') const browserify = require('browserify') const riotify = require('riotify') const source = require('vinyl-source-stream') gulp.task('browserify', function(){ browserify({ entries: ['src/app.js'] }) .transform(riotify) // pass options if you need .bundle() .pipe(source('app.js')) .pipe(gulp.dest('dist/')) })
These are the simplest cases. uglify
and sourcemaps
would be needed.
Originally written by Jan Henning Thorsen - jhthorsen@cpan.org
Maintained by Gianluca Guarini - gianluca.guarini@gmail.com
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4