Advanced front-end automation with npm scripts
-
Upload
k88hudson -
Category
Technology
-
view
1.034 -
download
3
Transcript of Advanced front-end automation with npm scripts
“Systems tend to grow, and as they grow, they encroach”
“Systems tend to expand to fill the known universe.”
—John Gall, The Systems Bible
The more complex and self-sufficient the automated system, the more difficult it
will be understand and operate.
The Paradoxes and Ironies of Automation, David Wentzel. http://www.davewentzel.com/content/paradoxes-and-ironies-automation
1. Takes advantage of the natural interface presented by its component parts;
2. Breaks down complex things into simple, composable things;
3. Makes compromises intentionally, not circumstantially
Your system can win, if it:
npm scripts can:
transpile es2015, transpile jsx, minify/optimize code, optimize svgs, copy, rename and move files, compile css via a pre-processor, add autoprefixing, source maps for js/css development, build Android and Firefox OS apps from source with cordova, run unit tests, run code linting, run style checking,
run test coverage reporting, deploy releases, run watch for developer environment and live reload dev server, etc. etc. etc.
in twenty lines or less, with zero plugins.
Most tools already have a cli
browserify webpack mocha lessc joshing
eslint sass
uglifyjs svgo karma
module.exports = function(grunt) { grunt.initConfig({ browserify: { options: { debug: true, transform: ['reactify'] }, files: { './output.js': './entry.js' } }, });
grunt.loadNpmTasks('grunt-browserify'); grunt.registerTask('default', ['browserify']);};
npm version patch -m "Upgrade to %s for lolz"
> commit 522d0 “Upgrade to v0.0.1 for lolz” > new tag v0.0.1
"scripts": { "preversion": "npm run test && npm run build”, "postversion": "npm publish && git push --tags" }
http://www.infoq.com/presentations/Simple-Made-Easy
“Simple Made Easy”
Components of an automated system are simple when they have a single, well-defined objective.
Good complex tasks are composed
of well-defined simple ones.
What can you do?
- Try it out, talk about what’s hard
- Work on cross-platform bugs
- Share your recipes
- File bugs or help improve npm docs