What is a Makefile? And how is it different from a Gruntfile or npm run?

Question

Recently, while getting acquainted with the Mocha javascript testing framework, I came across this section that I didn't understand:

Makefiles

Be kind and don't make developers hunt around in your docs to figure out how to run the tests, add a make test target to your Makefile:

test:
    ./node_modules/.bin/mocha --reporter list

.PHONY: test

Which is hardly descriptive, and not very helpful if you don't know what a makefile is.

So, What is a Makefile? And how is it different from a Gruntfile or using npm run?

Answer 1

Makefile

A Makefile (usually with no file extension) is a configuration file used by the Unix make tool.

Quoted from one of the best introductions I have found on Make that I highly recommend you read if you are interested in knowing more about make specifically, and task-runners in general.

Make is the original UNIX build tool. It existed a long time before gulp, or grunt. Loved by some, loathed by others it is at least worth being aware of how make works, what the strengths are and where it falls short.

Make is available on UNIX-like systems. That means OSX, BSD and Linux. It exposes any system command meaning that you can run system commands and execute arbitrary scripts. There is no doubt that tools like gulp and grunt are inpsired by or at least a reaction to make.

To use make you create a Makefile and then run make [what to run] from the terminal.

Gruntfile.js

A Gruntfile.js is a javascript configuration file used by the Grunt.js tool.

The newer node.js version of make, if you will, is Grunt.js which is cross-platform (works on Windows) and written in Javascript. Both can do similar things like concatenate files, minify css, run tests, etc. and there is a lot of information on the web about Grunt.

'npm run'

Another option that some developers prefer to use is npm itself, using the npm run command as described in this informative post on how to use npm run for running tasks:

There are some fancy tools [Grunt] for doing build automation on javascript projects that I've never felt the appeal of because the lesser-known npm run command has been perfectly adequate for everything I've needed to do while maintaining a very tiny configuration footprint.

If you haven't seen it before, npm looks at a field called scripts in the package.json of a project in order to make things like npm test from the scripts.test field and npm start from the scripts.start field work.

npm test and npm start are just shortcuts for npm run test and npm run start and you can use npm run to run whichever entries in the scripts field you want!

Other good introductory resources:

• Introduction to grunt.js and npm scripts, and choosing between the two.
• Cross platform JavaScript.
• Package Managers: An Introductory Guide For The Uninitiated Front-End Developer.