rollup-plugin-css-only

Rollup plugin that bundles imported css

Features

• CSS is emitted as 1 asset
• Order of imports is guaranteed
• Watches CSS imports
• Typescript types

Installation

# v4 is compatible with Rollup 3 & 2
npm install --save-dev rollup-plugin-css-only

Usage

// rollup.config.js
import css from 'rollup-plugin-css-only'

export default {
  input: 'input.js',
  output: {
    file: 'output.js',
    format: 'es',
    assetFileNames: 'assets/[name]-[hash][extname]'
  },
  plugins: [css()]
}

// entry.js
import './reset.css'
import './layout.css'

/* layout.css */
@import './nested.css';
@import './more.css';

Options

There is 1 option: output.
By default the plugin will use output.assetFileNames to decide the filename.

css({
  // Optional: filename to write all styles to
  output: 'bundle.css'
})

Changelog

Please see CHANGELOG for more information what has changed recently.

Contributing

Contributions and feedback are very welcome.

To get it running:

1. Clone the project.
2. npm install
3. npm run build

Credits

• Thomas Ghysels
• All Contributors

License

The MIT License (MIT). Please see License File for more information.

Changelog

[4.0.0] - 2020-12-18

Changed

• BREAKING CHANGE: CSS is emitted as 1 asset instead of written using writeFile.
• Order of imports is guaranteed
• Require @rollup/pluginutils@4

Added

• Mark as compatible with rollup 3 #45 @el3um4s