Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including tris with all npm packages installed. Try it out:

var tris = require("tris")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

tris v1.0.1

template, style and script tags code rewriter

tris

npm build

Template, style and script tags code compiler.

Table of Contents

Background

tris is a compiler, that lets you transform files which contain a template, style and script tags. This package is intended to be primarly used by other packages and build tools.

By default it lets you combine any standard html, css and js code into a single file. The plugin based architecture lets you use the library in your existing applications - you can hook it in and turn on the plugins one by one, to simplify the code migrations.

<template>
<div class='foo'>Hello, world!</div>
</template>
<style>
.foo {
  color: red;
}
</style>
<script>
console.log('Hello, world!')
</script>

Install

npm install tris

API

async tris (source, options)

The source code can be transformed with plugins.

const tris = require('tris')

tris(source, {
  plugins: [
    function ({ template, style, script }) {
      // change the abstract syntax tree of given node here
    }
  ]
})

You can also preprocess the content of a chosen tag.

const tris = require('tris')

tris(source, {
  preprocess: (name, source) => {
    if (name === 'template') {
      return source.replace('foo', 'bar')
    }
    return source
  }
})

The abstract syntax trees are created via:

You can transform the abstract syntax trees with plugins. Order of the plugins matters, they're used sequentially.

Maintainers

@emilos.

Contributing

All contributions are highly appreciated! Open an issue or a submit PR.

License

MIT © buxlabs

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free