Supported bundlers
Rollup

Usage with Rollup

Installation

To use WyW-in-JS with Rollup, you need to use it together with a plugin which handles CSS files, such as rollup-plugin-css-only:

npm i -D rollup-plugin-css-only @wyw-in-js/rollup

Configuration

import wyw from '@wyw-in-js/rollup';
import css from 'rollup-plugin-css-only';
 
export default {
  plugins: [
    wyw({
      sourceMap: process.env.NODE_ENV !== 'production',
    }),
    css({
      output: 'styles.css',
    }),
  ],
};

If you are using @rollup/plugin-babel (opens in a new tab) as well, ensure the wyw plugin is declared earlier in the plugins array than your babel plugin.

import wyw from '@wyw-in-js/rollup';
import css from 'rollup-plugin-css-only';
import babel from '@rollup/plugin-babel';
 
export default {
  plugins: [
    wyw({
      sourceMap: process.env.NODE_ENV !== 'production',
    }),
    css({
      output: 'styles.css',
    }),
    babel({}),
    /* rest of your plugins */
  ],
};
EsbuildSvelte