npm-watch is a utility that allows you to run scripts in response to file changes. It is particularly useful for automating tasks such as building, testing, or linting your code whenever you make changes.
Watch and Run Scripts
This feature allows you to watch specific files or directories and run a script when changes are detected. In this example, the 'build' script will run whenever a JavaScript file in the 'src' directory changes.
{
"scripts": {
"build": "webpack",
"watch": "npm-watch"
},
"watch": {
"build": {
"patterns": ["src/**/*.js"],
"extensions": "js"
}
}
}Custom Watch Patterns
You can specify custom patterns to watch multiple directories or file types. In this example, the 'test' script will run whenever a JavaScript file in either the 'test' or 'src' directories changes.
{
"scripts": {
"test": "mocha",
"watch": "npm-watch"
},
"watch": {
"test": {
"patterns": ["test/**/*.js", "src/**/*.js"],
"extensions": "js"
}
}
}Run Multiple Scripts
You can configure npm-watch to run multiple scripts based on different file changes. In this example, both 'lint' and 'build' scripts are set to run when JavaScript files in the 'src' directory change.
{
"scripts": {
"lint": "eslint .",
"build": "webpack",
"watch": "npm-watch"
},
"watch": {
"lint": {
"patterns": ["src/**/*.js"],
"extensions": "js"
},
"build": {
"patterns": ["src/**/*.js"],
"extensions": "js"
}
}
}Nodemon is a utility that monitors for any changes in your source and automatically restarts your server. It is more focused on server-side applications and is widely used for Node.js development. Unlike npm-watch, which can run any npm script, nodemon is primarily used for restarting Node.js applications.
Chokidar is a highly efficient file watcher that can be used to watch file changes and trigger custom actions. It provides a more low-level API compared to npm-watch, allowing for more granular control over file watching and event handling.
The 'watch' package is a simple utility for watching changes in files or directories and executing commands. It is similar to npm-watch but offers fewer configuration options and is more lightweight.
Run scripts from package.json when files change.
monorepo setups: In a monorepo setup, npm-watch may fail with ENOENT. The solution is to have nodemon globally installed. See here for more contextInstall it:
npm install npm-watch
Add a top-level "watch" config to your package.json and a "watch" script to
your "scripts":
{
"watch": {
"test": "{src,test}/*.js"
},
"scripts": {
"test": "tape test/*.js",
"watch": "npm-watch"
}
}
There is the possibility to watch for different tasks
{
"watch": {
"run_android": {
"patterns": [
"app"
],
"extensions": "ts,html,scss",
"quiet": false
},
"run_ios": {
"patterns": [
"app"
],
"extensions": "ts,html,scss",
"quiet": false
}
},
"scripts": {
"watch_android": "npm-watch run_android",
"watch_ios": "npm-watch run_ios",
"run_android": "tns run android --emulator",
"run_ios": "tns run ios --emulator"
}
}
The top level keys of the "watch" config should match the names of your "scripts", and
the values should be a glob pattern or array of glob patterns to watch.
Also it is now possible to obtain a second parameter to define the script which should be run for watching and not watch all possible scripts at once.
If you need to watch files with extensions other than those that nodemon watches by default (.js, .coffee, .litcoffee), you can set the value to an object with patterns and extensions keys. You can also add an ignore key (a list or a string) to ignore specific files. Finally, you can add a quiet flag to hide the script name in any output on stdout or stderr, or you can use the inherit flag to preserve the original's process stdout or stderr. You can enable nodemon legacy watch and specify the restart delay in milliseconds with the corresponding flags.
The
quietflag was changed from astringto abooleanin0.1.5. Backwards compatibility will be kept for two patch versions.
Use runOnChangeOnly to set the nodemon option --on-change-only. Setting this to true tells nodemon to execute script on change only, not startup.
{
"watch": {
"test": {
"patterns": ["src", "test"],
"extensions": "js,jsx",
"ignore": "src/vendor/external.min.js",
"quiet": true,
"legacyWatch": true,
"delay": 2500,
"runOnChangeOnly": false
}
},
"scripts": {
"test": "tape test/*.js"
}
}
Start the watcher with npm run watch in a terminal, then edit some files:
mkdir src test
npm run watch &
cat <<EOF > test/test-sum.js
var test = require('tape')
test('sum module', function (t) {
var sum = require('../src/sum.js')
t.ok(sum(1, 2), 3, "Sums appear correct")
t.end()
})
EOF
(Feel free to use the editor of your choice, cat just makes for easy demos)
You should see that your tests ran automatically, and failed because src/sum.js
is missing. Let's fix that:
cat <<EOF > src/sum.js
module.exports = function (a, b) {
return 1
}
EOF
Our tests will run again, and this time they almost work. Let's fix sum.js:
cat <<EOF > src/sum.js
module.exports = function (a, b) {
return a + b
}
EOF
Tests run perfectly, ship it to the enterprise!
Once you have the watcher running, you can force restart all tasks by entering rs.
If you want to only force a single task, type the name of the key from the watch config (for example rs test).
setMaxListenersIf too many listeners are added to an event emitter, node.js will send a warning (rightfully so) about potential memory leaks.
The default maximum is 10. If you need more than that, you can add a top level global config to your package.json
"watchGlobalConfig": {
"setMaxListeners": true
}
And max listeners will be set on the relevant processes to the minimum needed to avoid the warning.
patternsArray of paths to watch
"patterns": ["src", "test"]
extensionsComma delimited list of file extensions to watch
"extensions": "js,jsx"
ignoreAdd an ignore property to your watch object. The value of ignore can be a string if you only want to ignore
a single glob:
"watch": {
"build": {
"ignore": "build",
...
}
...
}
Or an array if you want to ignore multiple globs:
"watch": {
"build": {
"ignore": [
"build",
"node_modules"
],
...
}
...
}
quietBoolean to hide the script name in any output on stdout and stderr
"quiet": false
inheritBoolean to preserve the original process' stdout and stderr
"inherit": false
legacyWatchBoolean to enable legacy watch
"legacyWatch": true
delayNumber of milliseconds to delay before checking for new files
"delay": 2500
clearBufferBoolean to clear the buffer after detecting a new change
"clearBuffer": true
verboseBoolean to turn on the nodemons verbose mode
"verbose": true
silentBoolean to turn on nodemons silent (quiet) mode Silent was used as we already had an existing flag called quiet. This may change in a future release
"silent": true
This module does very little but run nodemon for you, all
credit for the reliable file watching and process restarting should go to there.
MIT
FAQs
run scripts from package.json when files change
We found that npm-watch demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 4 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
PyPI confirms no security flaws were exploited in the Ultralytics supply chain attack and highlights improvements for safer package publishing.
Security News
Research
The Socket Research Team breaks down a malicious wrapper package that uses obfuscation to harvest credentials and exfiltrate sensitive data.
Research
Security News
Attackers used a malicious npm package typosquatting a popular ESLint plugin to steal sensitive data, execute commands, and exploit developer systems.