GithubHelp home page GithubHelp logo

npm_as_build_tool's Introduction

NPM As Build Tool

Development progress

compile/transform -> bundle -> optimize -> test -> deploy

Why use npm as build tool

Run Test

$ npm run-script test
$ npm run test
$ npm test
$ npm tst
$ npm t

Run npm script in silent mode

$ npm test -s

Run script pre- and post-

$ npm run pretest
$ npm test -s

customize hooks

$ npm run greet -s

Run npm script sequence as following:

prescriptname -> scriptname -> postscriptname

Run many script

"scripts": {
    "compile": "npm run compile:coffee && npm run compile:es6"
}

$ npm run compile

If the first script run failed, and then left script will not run.

clean files or directories

For windows platform, we could use rimraf package

$ npm install rimraf --save-dev

NPM operators

  1. &&

If the left operation failed, the right operation will not run

  1. |

The left operation result will be the right command first parameter

  1. --

It could allow to pass argument throught underline commander

The left operation result will be writen to right destination file.

NPM Commander

  1. npm --help

To see all of avaiable npm commanders

  1. npm run

To check which script command you could use

pipeline

Before script

"build:bundle": "browserify ./src/app.js -o ./public/js/bundle.js",
"build:uglify": "uglifyjs ./src/app.js -mc -o ./public/js/bundle.min.js"

After pipeline

"build:bundle": "browserify ./src/app.js | uglifyjs -mc > ./public/js/bundle.js"

The | left commander output as second command first parameter

build script procedure

"build:clean": "rimraf public/css/* public/js/*",
"prebuild": "npm run build:clean",
"build": "npm run compile:less && npm run build:bundle"
  1. run "prebuild": "npm run build:clean"

  2. run "rimraf public/css/* public/js/*"

  3. run "npm run compile:less" and related hooks script

  4. run npm run build:bundle and related hooks script

watch

  • client watch(watch, watchify)

  • server watch(nodemon)

Version migration

The common version follows semver.org

Major.Minor.Patch

But we could remember as following:

Breaking.Feature.Bugfix

How to migration version?, firstly, you could check help info

$ npm version --help

Then add script task.

$ npm run version:patch

This will change package.json version value.

Git tag

Check current version or check differencs

$ git remote -v
$ git tag
$ git show v1.0.1

Deploy to cloud

  • heroku
  • aws
  • azure

npm_as_build_tool's People

Contributors

dongtong avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.