browser-module-env

Recycled environment & assets for making browser modules.

Install

npm install --save-dev browser-module-env

Usage

After installing:

1. Create a flyfile.js in your root directory with the following:

process.env.OUTNAME = 'MyModule'; // module's name
process.env.OUTFILE = 'my-module.js'; // built file name
module.exports = require('browser-module-env/flyfile.js');

This will expose this module's pre-configured command scripts.

1. Connect this module's commands to your package.json file within "scripts":

"scripts": {
  "setup": "fly setup",
  "build": "fly build",
  "docs": "fly docs",
  "release": "fly release",
  "start": "fly release serve",
  "watch": "fly watch"
}

This will let you execute commands with npm.

For example, npm run watch.

1. Configure Fly so that it loads this environment. Add this to your package.json file:

"fly": {
  "pkg": "node_modules/browser-module-env"
}

1. Copy static assets to your docs directory.

npm run setup

If this works, you're ready to roll! 🎉

Commands

Each command takes the form: npm run {command}.

setup

Copies static demo assets (bg.jpg, chart.css, demo.css, demo.js) to your docs directory.

build

Builds the UMD module. Output is sent to build.

docs

Creates a browserify bundle, using docs/app.js as its entry file. Output is sent to docs/bundle.js.

release

Runs build and docs then minifies build/*.js and docs/bundle.js using Uglify JS.

Note: Your minified module will be saved with a .min.js extension in the build directory.

serve

Starts a local server on port 3000 using BrowserSync.

watch

Runs serve but will auto-compile & auto-reload the server after any file changes within docs directory.

License

MIT © Luke Edwards