rollup-plugin-stylus-compiler
A rollup plugin to compile stylus file (.styl or .stylus) to css file. This plugin only integrates stylus to do the compile job.
Need other plugin to deal with the compiled css content. Such as:
Supported rollup version :
| plugin version |
rollup version |
| 1.x |
1.x |
| 0.4.x |
0.48.0~0.68.2 |
| 0.1.0~0.3.x |
0.36.0~0.47.6 |
Use npm:
npm install --save-dev rollup-plugin-stylus-compiler
// or
npm i -D rollup-plugin-stylus-compiler
Use yarn:
yarn add rollup-plugin-stylus-compiler --dev
import { rollup } from 'rollup';
import stylus from 'rollup-plugin-stylus-compiler';
import css from 'rollup-plugin-css-porter';
rollup({
input: 'main.js',
plugins: [ stylus(), css()]
}).then(bundle => {
bundle.write({
format: 'es',
file: 'bundle.js'
});
});
Output bundle.css and bundle.min.css.
import { rollup } from 'rollup';
import stylus from 'rollup-plugin-stylus-compiler';
import postcss from 'rollup-plugin-postcss';
rollup({
input: 'main.js',
plugins: [ stylus(), postcss({ include: '**/*.css' })]
}).then(bundle => {
bundle.write({
format: 'es',
file: 'bundle.js'
});
});
Inline css to bundle.js.
import { rollup } from 'rollup';
import stylus from 'rollup-plugin-stylus-compiler';
import css from 'rollup-plugin-css-only';
rollup({
input: 'main.js',
plugins: [ stylus(), css()]
}).then(bundle => {
bundle.write({
format: 'es',
file: 'bundle.js'
});
});
Output bundle.css.
Use npm:
Use yarn:
Use npm:
Use yarn: