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.