Numerous Philanthropic Misanthropes

    This package has been deprecated

    Author message:

    Nolonger actively maintained. See for more detail


    0.2.17 • Public • Published

    grunt-styleguide build status Bitdeli Badge Views in the last 24 hours


    Universal CSS styleguide generator for grunt. Easily integrate Styledocco or KSS styleguide generation into your development workflow.



    Framework Preprocessor Templates
    styledocco Less, Sass Default template provided by styledocco is used
    kss-node Less Custom templates can be used

    Getting Started

    If you haven't used grunt before, be sure to check out the Getting Started guide.

    From the same directory as your project's Gruntfile and package.json, install this plugin with the following command:

    npm install grunt-styleguide --save-dev

    Once that's done, add this line to your project's Gruntfile:


    If the plugin has been installed correctly, running grunt --help at the command line should list the newly-installed plugin's task or tasks. In addition, the plugin should be listed in package.json as a devDependency, which ensures that it will be installed whenever the npm install command is run.

    The "styleguide" task


    In your project's Gruntfile, add a section named styleguide to the data object passed into grunt.initConfig().

      styleguide: {
        options: {
          // global options
        your_target: {
        	options: {
        		// task options
            files: {
                // files to process

    An example configuration can be viewed here


    By default grunt-styleguide will attempt to rationalize options for each of the styleguide frameworks supported depending upon the features available to the framework in use.

    Key Type Default Required Description
    framework String, object, function (*) styledocco No Details about the styleguide framework
    name String undefined No Title of the styleguide
    template Object Template bundled with framework No Details of the templates to use for rendering if supported
    files Object, String, Array undefined Yes Details of the templates to use for rendering if supported

    * See extending grunt-styleguide

    Framework Options

    Should you wish to pass additional options which are supported by a framework then these can be passed as an options as part of the framework object.

    styleguide: {
        dist: {
            options: {
                framework: {
                    name: 'framework_name',
                    options: {
                        'somearg': 'somevalue',
                        'someflag: true
            files: {
                'path/to/dest': 'path/to/source'

    Template Options

    Depending upon the framework, it may be possible to also pass templates to use for rending a styleguide.

    styleguide: {
        dist: {
            options: {
                template: {
                    src: 'path/to/templates',
                    include: ['path/of/resources/to/include']
            files: {
                'path/to/dest': 'path/to/source'
    Key Type Required Description
    src String No Location of the template to use
    include String, Array No Resources to include

    Depending upon the framework you wish to use example templates can be found in:


    A generic template is provide also:


    Copy these to a location which is part of your project and modify your gruntfile to support your individual requirements.

    CSS Preprocessors

    By default grunt-styleguide will determine the CSS preprocessor to use by evaluating the selected source files. This value will be passed as an option to framework and if supported will be used by it.

    Usage Examples

    Default Options

    In this example a styleguide will be generated using the default generator, styledocco. Guides will be created for css/scss located within the core and plugins directory and output them to the appropriate destination specified.

      styleguide: {
      	dist: {
            files: {
              'docs/core': 'stylesheets/sass/core/*.scss',
              'docs/plugins': 'stylesheets/sass/plugins/*.scss'


    In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using grunt.

    Release History

    • 0.2.17

      • Fix KssStateGenerator ( @stickel )
    • 0.2.16

      • Remove direct dependency upon grunt-lib-contrib
      • Readme fix ( @firehist )
      • Readme fix ( @ryanmargheriti )
      • Readme fix ( @andrew-luhring )
    • 0.2.15

      • Dependencies updates ( @shinnn )
      • Move helper out of tasks directory to avoid "No tasks were registered or unregistered." warning ( @princed )
      • Config example error fixes ( @levito )
    • 0.2.14

      • Lock version of styledocco ( @jreading )
    • 0.2.13

      • Relativize absolute paths
      • Rewrite findBasePath function ( @mikedingjan )
      • Update Grunt getting started docs url ( @iamblue )
      • It's Sass, not SASS ( @kaelig )
    • 0.2.12

      • Cleanup release history
      • Use inherited version of LESS ( @pokornyr )
      • Small documentation typo ( @simonwjackson )
    • 0.2.11 | Updated styledocco dependency (#16)

    • 0.2.10 | KSS fix (#15)

    • 0.2.9 | Simplify styledocco plugin

    • 0.2.8

      • Updated styledocco dependencies
      • Added Stylus
    • 0.2.7 | Cumulative fixes (Issues #18, #14, #11) [ sorry for the delay ]

    • 0.2.6 | Minor code tweaks to resolve some user issues

    • 0.2.5 | Node.js ~0.10.0 compatibility

    • 0.2.4 | Pass local less path to styledocco

    • 0.2.3 | Styleguide nolonger uses custom node-kss fork (includes nolonger supported for KSS beware)

    • 0.2.2 | Grunt 0.4.0 support (~0.3.0 no longer supported)

    • 0.2.1 | Minor bug fix

    • 0.2.0

      • Revised documentation
      • Revised options structure
      • Introduced template options
      • Introduced node-kss
    • 0.1.1

      • Travis support
      • Grunt compatibility tweaks
    • 0.1.0 | Initial Release


    npm i grunt-styleguide

    DownloadsWeekly Downloads






    Last publish


    • indieisaconcept