budō allows you to get your scripts up and running quickly in a local environment.
First, you will need NodeJS and npm. Then you can install the tools globally:
npm install budo -gNow we can run budo to serve a file and start developing.
budo index.jsOpen http://localhost:9966/ to see the bundled result of index.js.
Saving index.js will be incremental, which means it will be fast even if your app spans hundreds of modules.
If you specify the current directory, it will resolve to the "main" field in your package.json, otherwise index.js.
budo .You can see the full list of command-line flags in the README.md.
Notice we haven't had to write any HTML! If you want to, though, you can drop index.html in the same folder that you are serving budō from (or the base --dir folder), and it will use that instead of a dynamically generated index.
The src for your script tag should match the filename of the entry point you gave.
<script src="index.js"></script>You can specify a different end point for the server with a colon. This is useful for relative and absolute paths, for example:
budo /proj/foo/index.js:static/bundle.jsNow, you can use the following as your HTML:
<script src="static/bundle.js"></script>Also see the [--serve option](#multiple entries).
If you are using these in your modules for demos/etc, you should save them locally so that others can get the same versions when they git clone and npm install your repo.
npm install budo --save-devFor local tools, we need to use npm-scripts. Open up your package.json and update "scripts" so it looks like this:
"scripts": {
"start": "budo index.js"
},Now running the following will start the development server:
npm run startbudō also includes support for LiveReload. The --live argument injects a script tag into your HTML file and listens for a live reload server.
budo index.js --liveNow when you save the index.js file, it will trigger a LiveReload event on your localhost:9966 tab after watchify has finished bundling. It also listens to HTML and CSS reload, and injects stylesheets without a page refresh.
From the command line, you can specify a filename glob to only trigger LiveReload in those cases. For example, to only allow CSS and HTML changes to trigger a LiveReload:
budo index.js --live=*.{html,css}Note: Your index.html must have a <body> tag for the LiveReload script to get injected!
Budo also supports multiple entry points; they will all get concatenated into a single bundle. If you aren't using a colon separator (:), the entry point will default to the first path. Or, you can explicitly set the path with the --serve option, as below:
budo test/*.js --serve static/bundle.jsNote: This uses unix glob expansion and may not work on Windows.
Everything after the -- argument will not be parsed/manipulated, and will be passed directly to browserify.
budo main.js --live -- -t babelify -t glslifyTo launch the browser once the server connects, you can use the --open or -o flag:
budo index.js --openAlso see opnr, which allows for a similar functionality without forcing it as a command-line flag.
In the CLI, you can run shell commands when the bundle updates using the --onupdate option. For example, to lint with standard and provide an alert with notify-error:
budo index.js --onupdate "standard | notify-error"Now, when you save the bundle, standard will run on your directory. If lint errors are found, they will print to the console and show an alert notification:
The flag is only available in the command-line.
By default, budo's server will listen on your internal IP. This address is the first message logged to terminal.
This makes it easy to test during development across devices.
You can specify another address with the --host flag.