bumble-build
Installation
Install from NPM:
npm install --save-dev bumble-build
node_modules/bumble-build/bin/init.coffee
A build setup using grunt, webpack, bumble-docs, bumble-test, ... that proabably will not work with your code.
This package is selfishly supported. I hate repeating code. This is the grunt + webpack + bumble_* build used by react-datum and tilegrid packaged for shared build stuff used by both (maybe more) packages.
See react-datum grunt file, webpack.config for example usage.
See bumble-docs for information on documentation generator used. Note that docs and examples are not built by default. You will need to run grunt docs
from your project root and you may only want to do that in your gh-pages branch.
Grunt
See also the Grunt Getting Started for more information on grunt. The init.coffee script will install all of the necessary npm packages except:
** You must install grunt-cli globally **
sudo npm install -g grunt-cli
You can
grunt build
or clean and build:
grunt clean build
or watch for changes to src and rebuild dist files:
grunt watch
To see all of the tasks offered:
~/projects/zulily/tilegrid$ grunt
Running "availabletasks:tasks" (availabletasks) task
build => Builds everything including docs, examples
clean -> Remove all compiled files. Use `grunt clean build` to rebuild everything from scratch (distrib|docs)
docs => Build the docs. To publish to github.io, you must pull master into gh-pages
test => Builds everything and then run tests in /test
watch > Watch for changing files and calls build. Also watches examples and docs
you can also get more fancy and make modifications / additions to the standard config:
# my Gruntfile.coffee
BumbleBuild = require('bumble-build')
module.exports = (grunt) ->
bbConfig = module.exports = (grunt) -> BumbleBuild.gruntConfig grunt,
# change where we get css files from so we don't pick up the docs dir
cssmin:
distrib:
files:
"dist/react-datum.css": [
'css/react-datum/*.css'
]
shellConfig = grunt.config.get('shell')
shellConfig.distrib = ``
command: 'coffee -o lib/ src/'
grunt.config.set('shell', shellConfig)
# we don't need no stinking webpack
grunt.registerTask 'distrib', ['shell:distrib']```
tests
Any .coffee or .cjsx files found in the test/
directory are assumed to be Mocha Chai compatible tests and are run when grunt test
is executed.
Any files in subfolders named '...lib/...' are ignored.
Convention
We assume some defaults about the locations of things and if everyone at least put things in the same place, ....
from project root:
|path or file|content description|
|docs/ | Generated documentation goesa here. Some directories in here will be wiped by running grunt clean
|
|dist/ | Generated webpack bundles go here
|src/ | Source code for app or package |
|examples/ | Source code for examples that get included in static docs. see [bumble-docs]|
|test/ | Mocha tests for app |
|index.js | This file is the default entry point for the package and resulting webpack. |
|package.json| see next section |
package.json
The name attribute from your package.json is used for nameing distribution files created by webpack. The camel cased name attribute from package.json is also used as the default output.library for webpack config. The main attribute from package.json file is used as default entry for webpack config.
webpack.*.config
You can override specific webpack configuration details by providing a webpack.config.coffee or webpack.config.js file in your project root directory. Your webpack.config file only need specify the things you want in addition to, or to override from bumble-build webpack config.
Currently, bumble-build looks for the following webpack config files:
webpack.config.(js|coffee) - the base unoptimized configuration
webpack.optimized.config.(js|coffee) - the minified & optimized configuration
Example, specify a different set of entry points for webpack (in file named webpack.config.js in your project root):
module.exports = {
entry: [
"webpack-dev-server/client?http://localhost:3000",
"webpack/hot/only-dev-server",
"./myAwesomePackage.js"
]
}