rollup-plugin-css-porter
A rollup plugin to collect all the imported css file
Last updated 8 months ago by rjhwang .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install rollup-plugin-css-porter 
SYNC missed versions from official npm registry.

rollup-plugin-css-porter

A rollup plugin to collect and combine all the imported css file. Such as import './my.css'. Then output them to a standalone css file. Besides, use clean-css to create a minified css file as you wish.

Supported rollup version :

plugin version rollup version
1.x 1.0.0+
0.3.x 0.48.0~0.68.2
0.1.0~0.2.x 0.36.0~0.47.6

Installation

Use npm:

npm install --save-dev rollup-plugin-css-porter
// or
npm i -D rollup-plugin-css-porter

Use yarn:

yarn add rollup-plugin-css-porter --dev

Plugin options

Name ValueType Required Description
dest String false Default value is the same dir of 'bundle.write(options)' options.file
raw Boolean
String
false 1. Boolean value means whether output a raw css file, default value is true
2. String value means output raw css file to this path
minified Boolean
String
false 1. Boolean value means whether output a minified css file, default value is true
2. String value means output minified css file to this path

If set raw or minified option to a String value, dest option will be ignored.

Usage

Case 1 (default behavior):

Output to a standalone css file and a minified css file. The output destination is the same dir of 'bundle.write(options)' options.file.

import { rollup } from 'rollup';
import css from 'rollup-plugin-css-porter';

rollup({
  input: 'main.js',
  plugins: [ css() ]
}).then(bundle => {
  bundle.write({
    format: 'es',
    file: 'bundle.js'
  });
});

Case 2:

Output to a standalone css file without minified css file. The output destination is the same dir of 'bundle.write(options)' options.file.

import { rollup } from 'rollup';
import css from 'rollup-plugin-css-porter';

rollup({
  input: 'main.js',
  plugins: [ css({minified: false}) ]
}).then(bundle => {
  bundle.write({
    format: 'es',
    file: 'bundle.js'
  });
});

Case 3:

Output to a specific path if config the plugin options.dest.

import { rollup } from 'rollup';
import css from 'rollup-plugin-css-porter';

rollup({
  input: 'main.js',
  plugins: [ css({dest: 'path-to-my-dir/bundle.css'}) ]
}).then(bundle => {
  bundle.write({
    format: 'es',
    file: 'bundle.js'
  });
});

Case 4:

Output to a standalone css file with only minified css file. The output destination is the same dir of 'bundle.write(options)' options.file.

import { rollup } from 'rollup';
import css from 'rollup-plugin-css-porter';

rollup({
  input: 'main.js',
  plugins: [ css({raw: false}) ]
}).then(bundle => {
  bundle.write({
    format: 'es',
    file: 'bundle.js'
  });
});

Case 5:

Custom output filenames by config a string value for plugin raw and minified option :

import { rollup } from 'rollup';
import css from 'rollup-plugin-css-porter';

rollup({
  input: 'main.js',
  plugins: [ css({
    raw: 'custom.css',
    minified: 'custom.min.css',
  }) ]
}).then(bundle => {
  bundle.write({
    format: 'es',
    file: 'bundle.js'
  });
});

Or:

css({
  raw: 'custom.css',
  minified: false,
})

Or:

css({
  raw: false,
  minified: 'custom.min.css',
})

Build

Use npm:

npm run build

Use yarn:

yarn run build

Run test

Use npm:

npm test

Use yarn:

yarn test

Current Tags

  • 1.0.2                                ...           latest (8 months ago)

9 Versions

  • 1.0.2                                ...           8 months ago
  • 1.0.1                                ...           8 months ago
  • 1.0.0                                ...           8 months ago
  • 0.3.0                                ...           8 months ago
  • 0.2.1                                ...           8 months ago
  • 0.2.0                                ...           10 months ago
  • 0.1.2                                ...           3 years ago
  • 0.1.1                                ...           3 years ago
  • 0.1.0                                ...           3 years ago
Maintainers (1)
Downloads
Today 2
This Week 8
This Month 57
Last Day 6
Last Week 27
Last Month 42
Dependencies (5)
Dev Dependencies (4)

Copyright 2014 - 2016 © taobao.org |