Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/thgh/rollup-plugin-css-only
Rollup plugin that bundles imported css
https://github.com/thgh/rollup-plugin-css-only
Last synced: 29 days ago
JSON representation
Rollup plugin that bundles imported css
- Host: GitHub
- URL: https://github.com/thgh/rollup-plugin-css-only
- Owner: thgh
- License: mit
- Created: 2016-09-14T00:09:08.000Z (about 8 years ago)
- Default Branch: v4
- Last Pushed: 2023-11-08T11:43:07.000Z (about 1 year ago)
- Last Synced: 2024-05-23T10:01:24.305Z (7 months ago)
- Language: JavaScript
- Size: 121 KB
- Stars: 108
- Watchers: 2
- Forks: 28
- Open Issues: 12
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
- awesome - css-only
README
# 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 4 & 3 & 2
# Rollup 4 since v4.4
npm install --save-dev rollup-plugin-css-only
```
## Usage
```js
// 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()]
}
```
```js
// entry.js
import './reset.css'
import './layout.css'
```
```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.
```js
css({
// Optional: filename to write all styles to
output: 'bundle.css'
})
```
## Changelog
Please see [CHANGELOG](CHANGELOG.md) 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](https://github.com/thgh)
- [All Contributors][link-contributors]
## License
The MIT License (MIT). Please see [License File](LICENSE) for more information.
[link-author]: https://github.com/thgh
[link-contributors]: ../../contributors
[rollup-plugin-vue]: https://www.npmjs.com/package/rollup-plugin-vue
[rollup-plugin-buble]: https://www.npmjs.com/package/rollup-plugin-buble
[rollup-plugin-babel]: https://www.npmjs.com/package/rollup-plugin-babel
[vue-template-compiler]: https://www.npmjs.com/package/vue-template-compiler