rollup-plugin-caveman
TypeScript icon, indicating that this package has built-in type declarations

0.0.6 • Public • Published

rollup-plugin-caveman

🍣 A Rollup plugin to convert Caveman templates to ES6 modules.

Requirements

This plugin requires an LTS Node version (v16.0.0+) and Rollup v1.20.0+.

Install

Using yarn:

yarn add --dev rollup-plugin-caveman

Note that caveman is a peer dependency of this plugin that needs to be installed separately.

Usage

Create a rollup.config.js configuration file and import the plugin:

import caveman from 'rollup-plugin-caveman';

export default {
  input: 'src/index.js',
  output: {
    dir: 'output',
    format: 'cjs',
  },
  plugins: [caveman()],
};

Then Caveman templates can be imported as ES6 modules.

Example:

Assuming we have a userList.html template with the following contents:

<ul>
  {{- for d.users as user }}
  <li class="user">{{user.name}}</li>
  {{- end }}
</ul>

With an accompanying file src/index.js, we could import the template and use it like seen below:

import UserList from './userList.html?caveman';

document.body.innerHTML = UserList.render({
  users: [
    { name: 'Ringo' },
    { name: 'Paul' },
    { name: 'George' },
    { name: 'John' },
  ],
});

The resulting ES6 module exposes a single render function that takes any arguments defined in the template and returns a string, if we loaded src/index.js in a browser, body.innerHTML would be replaced with:

<ul>
  <li class="user">Ringo</li>
  <li class="user">Paul</li>
  <li class="user">George</li>
  <li class="user">John</li>
</ul>

The plugin also supports partials, by default it'll look for partials in the parent template's folder or you can also define specific paths to look for partial templates using the partialPaths option.

Options

exclude

Type: String | Array[...String]
Default: null

A picomatch pattern, or array of patterns, which specifies the files in the build the plugin should ignore. By default no files are ignored.

include

Type: String | Array[...String]
Default: '**/*.html?caveman'

A picomatch pattern, or array of patterns, which specifies the files in the build the plugin should operate on. By default all files are targeted.

partialPaths

Type: Array[...String]
Default: []

A list of paths to search for partials in case they're not located in the same directory as the template.

License

MIT

Package Sidebar

Install

npm i rollup-plugin-caveman

Weekly Downloads

91

Version

0.0.6

License

MIT

Unpacked Size

49.6 kB

Total Files

41

Last publish

Collaborators

  • jorgeimo