Simple build tools: npm scripts vs Makefile vs runjs

Originally published by Paweł Gałązka on October 2nd 2016 15,865 reads

@pawelgalazkaPaweł Gałązka

Frontend Developer

Command line based build tools gain a lot of attention in the JavaScript world recently. They are straightforward, flexible and quite easy to manage compare to verbose Grunt.js/Gulp.js files and workflows. This goes with the way of being agile and adaptable which is more and more important in the fast changing JavaScript world. But which command line based build tool to choose ? What’s the differences between them ?

Quick sum up of complex build systems

Main disadvantages:

• Dependence on plugins and their documentation. They are not always up to date, can break later and cause pain with the debugging. Docs are spread out across different projects and finding things which you are looking for can be really hard.
• Bloat. It’s very common to end up with Gruntfile or Gulpfile which has hundreds of lines of code. Code is hard to understand, maintain and trying custom solutions is very challenging. It requires a lot of knowledge about the building system. Whole approach seems to be over-engineered and unnecessary complex.

Further reading:

Simple build tools

We have 3 candidates: npm scripts, Makefile and runjs. All of those are based on command line scripting. You don’t need much of knowledge about those tools. They are very easy with their construction and workflow. What is important is how you can effectively manage command line scripts.

Main advantages:

• shallow learning curve
• easy customisation, flexibility
• plugins are not needed, cli commands are powerful enough

npm scripts

Built-in feature into npm package manager. Content of each task is held in package.json under “scripts” section. Each task can be called by npm run [task-name] command. [More].

Pros:

• you don’t need to install additional tools, npm scripts are part of npm, so you are ready to go right away
• hook scripts, which can be run in specific situations, like prepublish, postinstall or pretest

Cons:

• when scripts get complex they are hard to read
• introducing more complex logic like conditional checks, errors or argument handling can be problematic to implement and maintain
• you can’t use JavaScript code unless you export it to a separate script file
• it’s hard to document tasks

Obviously you can reduce those cons by extracting commands from scripts section to separate files (bash/node scripts) and call them in npm scripts. In the end it’s not necessary convenient though as you will have your build code spread out across multiple files. For tasks up to 15/20 lines of code which are quite frequent it can feels just too much. Moreover if you want to use ES6/7, ES6 imports in your node.js build scripts you need to compile them. That complicate the process unnecessary.

Example of npm scripts usage:

Example of calling a task:

npm run watch:test

Makefile

Build automation tool created by Stuart Feldman and initially released in 1977. With the main purpose for C/C++ code compilation. However thanks to its flexibility it started to gain more universal usage. It allows to define tasks in “Makefile” file. Tasks can be called by make command in the terminal. [More].

Pros:

• implementing more complex logic is not an issue
• good readability
• you don’t need to install additional tools (unless you are Windows user), make should be already present in the unix environment

Cons:

• you are tied to shell code, you can’t use JavaScript which you already know
• this means that sometimes shell code can be hard to deal with. Additional learning curve for complex logic.

Example of Makefile:

Example of calling a task:

make test

runjs

Written in JavaScript. Minimalistic build tool. Can be installed through npm. Allows to define tasks in “runfile.js” file. Tasks can be called by run (or npx run) command in the terminal. [More].

Pros:

• you can use JavaScript within tasks (with ES6/7) and import other npm modules. runfile.js is just a JavaScript module. This allows massive flexibility.
• you can do command line calls also, by run function
• good readability
• it handles task arguments easily

Cons:

• global run command which needs to be installed through npm -g runjs-cli. This can be avoided in node ≥ 8.2, where you can call runjs tasks through npx, like “npx run dev”. More about npx.

Example of runfile.js:

Example of calling a task:

run test
run lint components/App.js --fix
run build:clean

Conclusions

I would say that considering the simple build tooling, all of those 3 are really good. The main difference is within the relation between flexibility and readability. In that matter runjs seems to be the strongest.

For further experimenting I give you a couple of interesting examples which are easy to do in runjs but can be hard to manage in npm scripts or Makefile.

Documenting tasks:

$ run build --help

Sharing tasks to a npm package:

$ run shared

Accepting arguments and conditional checks:

$ run test sidebar/button.js browser

Error handling and fallbacks:

$ run build

Handling async calls:

$ run start

The missing guide for building large-scale mobile apps