grunt-explainjs

A grunt plugin to generate instant side-by-side view of your comments and code.

grunt-explainjs

A grunt plugin to generate instant side-by-side view of your comments and code (thanks to ExplainJS).

This plugin requires Grunt ~0.4.1

If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

npm install grunt-explainjs --save-dev

Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:

grunt.loadNpmTasks('grunt-explainjs');

Here is ExplainJS ran on this grunt plugin.

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

grunt.initConfig({
  explainjs: {
    dist: {
      options: {
        showFilename: true // default is false 
      },
      files: [{
        src: ['dist/scripts/scripts.js'],
        dest: 'dist/explainjs/explain.html'
      }]
    },
  },
})

By default, this plugin will take the file in src (works best with one) and run ExplainJS on it, outputting the formatted results to the file specified in dest. I recommend using this at a point in your build process that happens after concatenation but before minification.

With the following config:

grunt.initConfig({
  explainjs: {
    options: {},
    files: {
      'dist/explainjs/explain.html': ['dist/scripts/scripts.js'],
    },
  },
})

Your build task might look like this:

grunt.registerTask('build', [
  'clean:dist',
  'jshint',
  'test',
  'compass:dist',
  'useminPrepare',
  'imagemin',
  'cssmin',
  'htmlmin',
  'concat', // concat files here, gives me dist/scripts/scripts.js (not minified) 
  'explainjs', // explain here 
  'copy',
  'usemin',
  'ngmin',
  'uglify'
]);

Type: Boolean Default value: false

Specifies whether or not to show (and include a link to) the file that ExplainJS was ran on. In some (most?) cases that file will be minified or moved. But if needed, the option is there.

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.

(Nothing yet)