Socket
Socket
Sign inDemoInstall

@web/dev-server-rollup

Package Overview
Dependencies
81
Maintainers
6
Versions
80
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    @web/dev-server-rollup

Use rollup plugins in @web/dev-server


Version published
Maintainers
6
Created

Readme

Source

Dev Server Rollup

Use rollup plugins in web dev server and web test runner.

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

Since the dev server doesn't run an actal rollup build, only rollup plugins which do single file transformations can be reused.

Installation

npm i --save-dev @web/dev-server-rollup

Usage

Import the rollup plugin and the rollupAdapter function in your configuration file. Then, wrap the rollup plugin with the adapter function:

const replace = require('@rollup/plugin-replace');
const { rollupAdapter } = require('@web/dev-server-rollup');

module.exports = {
  plugins: [rollupAdapter(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/or exclude options available in most rollup plugins.

non-standard file types

The rollup build process assumes that any imported files are are meant to be compiled to JS, web 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 the server to handle it as a JS file:

const json = require('@rollup/plugin-json');
const { rollupAdapter } = require('@web/dev-server-rollup');

module.exports = {
  plugins: [
    {
      name: 'json-mime-type-plugin',

      resolveMimeType(context) {
        if (context.path.endsWith('.json')) {
          return 'js';
        }
      },
    },

    rollupAdapter(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:

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

Keywords

FAQs

Last updated on 08 Jul 2020

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc