sheetify

Modular CSS bundler

sheetify

Modular CSS bundler. Works with npm modules like browserify does.

Features

  • rich plugin ecosystem
  • namespaced CSS modules using browserify
  • tiny API surface
  • [WIP] works with LESS, SASS and regular CSS (CSS only right now)
  • [WIP] pass global variables into packages
$ npm install sheetify

js api

const sheetify = require('sheetify')
const path = require('path')
 
const opts = {
  use: [ [ 'sheetify-cssnext', { sourcemap: false } ] ],
  basedir: __dirname
}
 
sheetify(path.join(__dirname, 'index.css'), opts, function (errcss) {
  if (err) throw err
  console.log(css)
})

js stream api

const sheetify = require('sheetify/stream')
const path = require('path')
 
const opts = {
  use: [ [ 'sheetify-cssnext', { sourcemap: false } ] ],
  basedir: __dirname
}
 
sheetify(path.join(__dirname, 'index.css'), opts)
  .pipe(process.stdout)

cli api

Usage: sheetify [options] <target>
 
Options:
  -h, --help        Output usage information
  -v, --version     Output version number
  -u, --use         Use a sheetify transform
  -b, --basedir     Set the project base directory
 
Examples:
  $ sheetify index.js > bundle.css          # Bundle CSS to a file 
  $ sheetify -u sheetify-cssnext index.js   # Use a transform 
 
Docs: https://github.com/sheetify/sheetify
Bugs: https://github.com/sheetify/sheetify/issues

js api

const browserify = require('browserify')
const path = require('path')
 
browserify(path.join(__dirname, './index.js'))
  .transform('sheetify/transform')
  .bundle()
  .pipe(process.stdout)

package.json transform

{
  "name": "my-app",
  "browserify":{
    "transform": [
      "sheetify/transform"
    ]
  }
}

cli

$ browserity -t sheetify/transform index.js > bundle.js

MIT