rollup-plugin-jsx-js

rollup-plugin-jsx-js

JSX.js wrapper for Rollup

Install

$ npm install --save-dev rollup-plugin-jsx-js

Usage

import jsx from 'rollup-plugin-jsx-js';

export default {
  dest: 'build/app.js',
  entry: 'src/index.js',
  sourceMap: true,
  plugins: [
    jsx({precise: true})
  ]
};

Options

precise

Type: boolean
Default: false

Should the source-mapping be precise?

Precise mappings map every single character, which allows your devtools to trace & pinpoint everything's exact location. With less precise mappings, devtools may only be able to identify the correct line. However, they're quicker to generate and less bulky.

Advanced Options

In addition to precise, you may want to define custom mappings for fuller control of your compiled JSX output.

The following functions are available to you: text, element, component, props, and stringify.

// rollup.config.js
import jsx from 'rollup-plugin-jsx-js';

export default {
  entry: '...',
  plugins: [
    jsx({
      precise: true,
      text: children => ({...}),
      element: (type, props, children) => (...),
      component: (type, props, children) => ({...}),
      props: (key, value, props, node) => ({...}),
      stringify: (type, props, children, nodeType) => ({...})
    })
  ]
}

License

MIT © Luke Edwards