For this example, we're building several packages: core-js
, core-css
, extras-js
, and extras-css
.
Using grunt.initConfig
, you'll see that our packages are completely intermingled. In order, you'll see core-css
, core-js
, extras-js
, extras-css
, options
, core-js
, extras-js
, options
, core-css
, core-js
, extras-css
, and extras-js
.
Using grunt.mergeConfig
, the resulting config object is identical. However, each package comprises its own code block, and are completely modular from other packages. In order, you'll see options
, core-js
, core-css
, extras-js
, and extras-css
.
Any project that builds more than 1 simple package will greatly benefit from this organizational pattern.
For example, Bootstrap's Gruntfile builds 4 separate packages (bootstrap.js, bootstrap.css, bootstrap-theme.css, docs), jQuery UI builds 3 packages (jquery-ui.js, jquery-ui-i18n.js, jquery-ui.css), and practically every significant project builds multiple packages.