Last active
January 5, 2016 17:08
-
-
Save worldsayshi/989ff7bae88a33722c8d to your computer and use it in GitHub Desktop.
Browserify es6 and react example build/watch script.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"name": "redux-browserify-es6-example", | |
"main": "js/index.js", | |
"scripts": { | |
"test": "mocha --require babel-core/register", | |
"test:watch": "npm test -- --watch" | |
}, | |
"dependencies": { | |
"expect": "^1.13.4", | |
"express": "^4.13.3", | |
"react": "^0.14.3", | |
"react-dom": "^0.14.3", | |
"react-redux": "^4.0.6", | |
"redux": "^3.0.5", | |
"redux-thunk": "^1.0.2", | |
"seamless-immutable": "^4.1.1", | |
"underscore": "^1.8.3" | |
}, | |
"devDependencies": { | |
"babel-preset-es2015": "^6.3.13", | |
"babel-preset-react": "^6.3.13", | |
"babelify": "^7.2.0", | |
"browserify": "^12.0.1", | |
"mocha": "^2.3.4", | |
"watchify": "^3.6.1" | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#!/usr/bin/env node | |
// package.json is provided as an example to show what deps this example works with | |
// it includes some additional deps like redux and mocha | |
// 1. Put es6/react code inn js folder and have index.js as starting point | |
// 2. Install deps with npm. | |
// 3. run `$ ./watch.js` | |
var fs = require("fs"); | |
var browserify = require("browserify"); | |
var watchify = require('watchify'); | |
function log (msg) { | |
console.log("["+new Date()+"]: "+msg); | |
} | |
var b = browserify({ | |
cache: {}, | |
packageCache: {}, | |
plugin: [watchify], | |
entries: ["./js/index.js"], | |
debug: true | |
}).transform("babelify", { | |
// `stage-2` currently needed for (some uses of?) spread operator | |
presets: ["es2015", "react", "stage-2"] | |
}).on('update', bundle) | |
.on('log', log); | |
bundle(); | |
function bundle() { | |
log("creating bundle"); | |
b.bundle((err, buf)=>{ | |
if(err){ | |
console.log(err.message) | |
return; | |
} | |
fs.writeFile("bundle.js",buf); | |
}); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment