es-dev-server-rollup

Use rollup plugins in es-dev-server.

> Warning: this project is still experimental.

Installation

``bash
npm i --save-dev es-dev-server-rollup
`

Usage

es-dev-server plugins and rollup plugins share a very similar API, making it possible to reuse many rollup plugins inside es-dev-server with an adapter.

Import the rollup plugin and the wrapRollupPlugin function in your es-dev-server config. Then, wrap the rollup plugin with the wrapper function:

`js
const replace = require('@rollup/plugin-replace');
const { wrapRollupPlugin } = require('es-dev-server-rollup');

module.exports = {
plugins: [
wrapRollupPlugin(
replace({ include: ['src/*/.js'], __environment__: '"development"' })
),
],
};
`

Performance

Some rollup plugins do expensive operations. During development, this matters a lot more than during a production build. It's recommended to always scope the usage of plugins using the include and exclude options.

non-standard file types

The rollup build process assumes that any imported files are are meant to be compiled to JS, es-dev-server serves many different kinds of files to the browser. If you are transforming a non-standard filetype to JS, for example .json files, you need to instruct es-dev-server to handle it as a JS file:

`js
const json = require('@rollup/plugin-json');
const { wrapRollupPlugin } = require('es-dev-server-rollup');

module.exports = {
plugins: [
{
resolveMimeType(context) {
if (context.path.endsWith('.json')) {
return 'js';
}
},
},
wrapRollupPlugin(json()),
],
};
`

Compatibility with rollup plugins

Since es-dev-server doesn't do any bundling, only the following lifecycle hooks from rollup are called:

- options
- buildStart
- resolveId
- load
- transform

Plugins that use other lifecycle hooks are mostly build optimizations and are not interesting during development.

The following rollup plugins have been tested to work correctly:

- @rollup/plugin-alias
- @rollup/plugin-inject
- @rollup/plugin-commonjs
- @rollup/plugin-dsv
- @rollup/plugin-image
- @rollup/plugin-json
- @rollup/plugin-node-resolve
- @rollup/plugin-replace
- @rollup/plugin-sucrase

The following rollup plugins don't work correctly at the moment:

- @rollup/plugin-typescript (use @rollup/plugin-sucrase` with transform TS option)