generator-rainman

A rainman project generator for Yeoman. Includes RequireJS, jQuery, Modernizr and Bootstrap (optionally).

Usage no npm install needed!

<script type="module">
  import generatorRainman from 'https://cdn.skypack.dev/generator-rainman';
</script>

README

Rainman generator Build Status

Scaffold out full assets structure with Yeoman, including a testing framework.

Rainman includes RequireJS, jQuery, Modernizr and Bootstrap (optionally). RequireJS and Modernizr are fully supported by Grunt tasks to enable a quick and smooth development workflow.

Testing is provided by Mocha (default), Jasmine or QUnit framework.

Maintained by Filip Mares.

Install

To install Rainman generator you need NPM and Yeoman. To install Yeoman you just need to run this from your command-line:

npm install -g yo

When ready, install generator-rainman by running:

npm install -g generator-rainman

Usage

Now, cd into an empty directory, run the command below, follow the prompts and choose the right options for your project:

yo rainman

Options

  • --skip-install

    Skips the automatic execution of bower and npm after scaffolding has finished.

  • --test-framework=<framework>

Defaults to mocha. Can be switched for jasmine or qunit.

Third-Party Dependencies

Third-party dependencies are managed with Bower. Add new dependencies manually using the command below:

bower install --save vendorLibraryName

Then add a script or style tag to your index.html or an other appropriate place.

RequireJS

All the JavaScript is written as AMD modules and required as needed. In development mode, the files are loaded asynchronously for easy debug. When building the distribution package, two uglified files are created: one with all the external resources modules (libraries, plugins...) and the second with all the implemented modules for your web app.

The behavior of RequireJS is defined by the files development.js and distribution.js. Visit this RequireJS example build to get more information.

jQuery

Includes jQuery as one of the resources dependency in RequireJS.

Modernizr

A full feature version of Modernizr is enabled for the development environment. When building the distribution package, a grunt task will check all JavaScript and CSS files to check which Modernizr dependencies are required and add them to the final uglified build file.

Bootstrap (optional)

If selected, includes LESS version of Bootstrap front-end framework and hook it to the stylesheets.

Grunt Tasks

grunt serve

  • Clean server folder
  • Compile LESS files
  • Checks RequireJS configuration
  • Start the connect server with livereload
  • Start watching files:
  • Compiles LESS on edit
  • Reloads the webpage on any resource change

grunt build

  • Clean the build folder
  • Concatenates and uglifies the compiled LESS files
  • Compresses images
  • Compresses SVG files
  • Concatenates and uglifies the JavaScript resources into 2 files (resources and main)
  • Generates the Modernizr dist file by parsing CSS and JavaScript files and defining all the required dependencies
  • Copies files from the resources folder
  • Adds revisions to static files

grunt test

  • Starts the connect server
  • Runs selected tests framework with provided unit tests

grunt

  • Runs JSHint against the JavaScript implemented code
  • Runs the test process
  • Runs the build process

License

MIT License