KSS ♥ brunch.io

Integrates the kss-node living styleguide generator into your brunch.io builds.

The plugin will generate the KSS node styleguide into <public>/styleguide.

Usage

Install the plugin via npm with npm install --save-dev kssbrunch or yarn add kssbrunch -D.

Options

Put all options for this plugin into the config.plugins.kss object, for example:

// file: brunch-config.js

module.exports = {
  plugins: {
    kss: {
      // include generated CSS files in the KSS styleguide. Defaults to true. 
      addCssFiles: true,
      // include generated JS files in the KSS styleguide. Defaults to true.
      addJsFiles: false,
      
      // kss-node specific config
      kssConfig: {
        // will be passed to kss-node
      }
    }
  }
};

See all possible options for the kssConfig object in the kss-node documentation.

Automatic KSS Config for CSS/JS Files

While the kssConfig options are passed to kss-node, parts of it are automatically generated by the plugin. The kssConfig.css and kssConfig.js options define a set of files paths that are included from the generated living styleguide document. kssbrunch automatically adds all CSS/JS files generated by brunch to those config options.

Note: In case you manually set the options in the brunch plugin config, kssbrunch will merge those with the files generated by brunch.

BrowserSync

This plugin supports Browsersync with the browser-sync-brunch plugin. To have an optimal integration between kssbrunch and browser-sync-brunch, add the following config:

// file: brunch-config.js

module.exports = {
  plugins: {
    browserSync: {
      server: {
        // serve all files from the brunch public folder
        baseDir: ["public"]
      },
      files: {
        // watch style guide files to trigger a reload on HTML changes 
        "public/styleguide/**/*.html"
      }
    }
  }
};

Contributing

Open a PR :-)

Change Log

See all changes made to this project in the change log. This project follows semantic versioning.

License

This project is licensed under the terms of the MIT license.

Project created and maintained by Fabian Keller.