1. rollup-plugin-css-only
Rollup plugin that bundles imported css
rollup-plugin-css-only
Package: rollup-plugin-css-only
Created by: thgh
Last modified: Mon, 06 Nov 2023 20:05:35 GMT
Version: 4.5.2
License: MIT
Downloads: 129,171
Repository: https://github.com/thgh/rollup-plugin-css-only

Install

npm install rollup-plugin-css-only
yarn add rollup-plugin-css-only

Rollup plugin that bundles imported css

Software License Issues JavaScript Style Guide NPM Latest Version

Features

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

Installation

# v4 is compatible with Rollup 4 & 3 & 2
# Rollup 4 since v4.4
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

License

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

Dependencies

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code