My npm scripts:
"build": "tsc -w -p ./src/server",
"run": "nodemon --watch ./dist/server ./dist/server/app.js",
"start": "concurrently --kill-others \"npm:build\" \"npm:run\""
From VSCode's terminal I can start the app using the start task.
But nodemon starts twice, and restarts multiple times when a file is saved. I assumed it's because the build task hasn't completed yet.
How can I make these work in series, so the one waits for the other? I do not want to use polling.
I'm using Ubuntu 18, node 10.15.0, npm 6.5.0.
Example of my configuration which works well:
package.json:
"start:dev": "nodemon --config nodemon.json ./dist/src/index.js",
nodemon.json:
{
"watch": ["src"],
"ext": "ts",
"ignore": ["src/**/*.spec.ts"],
"exec": "ts-node ./src/index.ts"
}
I realize that this is most likely a duplicate question. I'm new to nodemon and I'm trying to establish a server for a Vue JS project with nodemon. I'm trying to run eslint with nodemon and can't figure out why I keep getting the error message. If I remove npm after --exec it will tell me ''run' is not recognized, and if I remove that I will get ''lint' is not recognized and so on.
My package.json file:
{
"name": "server",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "nodemon src/app.js --exec 'npm run lint && node'",
"lint": "eslint **/*.js"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"eslint": "^4.16.0",
"nodemon": "^1.14.12"
}
}
I have also tried this code in my start scripts:
"scripts" : {
"start": "./node_modules/nodemon/bin/nodemon.js src/app.js --exec 'npm run lint && node'",
"lint": "./nodemodules/.bin/eslint **/*.js"
}
Where is tells me that "." is not recognized as an internal external command.
I've installed nodemon into my server folder and in the project directory as well as globally. I have done the same with eslint as well.
i had the same problem today. did some google stuff and found that this is not working anymore. so i tried this
"scripts": {
"prestart": "npm run lint ",
"start": "nodemon src/app.js ",
"lint": "./node_modules/.bin/eslint src/*.js"
},
when you npm start node will run the pre-start script before the start script.Once a file being updated this pre-start wont run by the nodemon.So for that we have to call the nodemon events.So create a nodemon.json on root folder and paste following.
{
"events": {
"restart": "npm run lint"
}
}
you can read more nodemon config options from here nodemon config .There are more nodemon events.you can read them from here event restart
PS:im very new to this. :)
EDIT1:
You can use as follows. this dont need a nodemon config;
"scripts": {
"start": "node src/app.js",
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "nodemon src/app.js --exec \"npm run lint --fix && node\"",
"lint": "eslint --fix **/*.js "
}
for run use npm run dev it will run es lint + nodemon. this is for windows cmd command.if you are using bash terminal, remove \ in "dev" ;
"dev": "nodemon src/app.js --exec "npm run lint --fix && node""
I had the same problem.
For some reason you can't use simple quotes in npm scripts.
Use escaped double quotes instead. This should work:
"start": "nodemon src/app.js --exec \"npm run lint && node\""
install it globally for making it available on path.
npm i -g nodemon
or if using yarn
yarn global add nodemon
and if you tried this approach and it didn't work.
you should try running it locally..
you have to create a script in your package.json like this
"script": {
"server" : "nodemon scriptFile.js" //name of the file you want to run
}
then use,
npm run server
but before it,
install nodemon locally.
check it, if it is available on package.json
I have this .babelrc file:
{
"presets": ["env"],
"outDir":"target",
"include":[
"src/**/*.js"
],
"ignore": []
}
I run babel -w and I get this error message:
--watch requires --out-file or --out-dir. --watch requires filenames
do I need to specify more options at the command line or is there something I can add to my .babelrc file?
There is no way to configure this in your .babelrc. But you could add something like this to the scripts section of your package.json:
"scripts": {
"watch": "babel --watch src --out-dir dist"
}
Then you can just run npm run watch from the root of that project.
If you want to execute your project each time you compile, you can use babel-watch.
I want to setup nodemon to run the "prestart" script when server restarts, the reason, I'm using webpack and I want to build bundle.js every time a file changes, I'm not using webpack-dev-server cause I don't know how to set it up with an existing node app running, I got my backend on node.js, help on that will be appreciated.
The way I've been working is: run npm start every time I make a change on the code, but that too much effort.
Here's the scripts object at package.json so that you have an idea of what's going on:
"scripts": {
"bundle": "webpack --config webpack.config.js",
"prestart": "npm run bundle",
"start": "node server.js"
}
The way I've accomplished to do that is by creating a nodemon.json file with the exec property:
{
// ... Other conf (see an example in https://github.com/remy/nodemon/blob/master/doc/sample-nodemon.md)
"watch": [
"app" // Set your directories/files to watch
],
"exec": "npm run prestart && node server/index.js"
}
Thanks to an excellent answer by #McMath I now have webpack compiling both my client and my server. I'm now on to trying to make webpack --watch be useful. Ideally I'd like to have it spawn something like nodemon for my server process when that bundle changes, and some flavor of browsersync for when my client changes.
I realize it's a bundler/loader and not really a task runner, but is there some way to accomplish this? A lack of google results seems to indicate I'm trying something new, but this must have been done already..
I can always have webpack package to another directory and use gulp to watch it/copy it/browsersync-ify it, but that seems like a hack.. Is there a better way?
Install the following dependencies:
npm install npm-run-all webpack nodemon
Configure your package.json file to something as seen below:
package.json
{
...
"scripts": {
"start" : "npm-run-all --parallel watch:server watch:build",
"watch:build" : "webpack --watch",
"watch:server" : "nodemon \"./dist/index.js\" --watch \"./dist\""
},
...
}
After doing so, you can easily run your project by using npm start.
Don't forget config WatchIgnorePlugin for webpack to ignore ./dist folder.
Dependencies
npm-run-all - A CLI tool to run multiple npm-scripts in parallel or sequential.
webpack - webpack is a module bundler. Its main purpose is to bundle JavaScript files for usage in a browser, yet it is also capable of transforming, bundling, or packaging just about any resource or asset.
nodemon - Simple monitor script for use during development of a node.js app.
Faced the same problem and found the next solution - webpack-shell-plugin.
It
allows you to run any shell commands before or after webpack builds
So, thats my scripts in package.json:
"scripts": {
"clean": "rimraf build",
"prestart": "npm run clean",
"start": "webpack --config webpack.client.config.js",
"poststart": "webpack --watch --config webpack.server.config.js",
}
If I run 'start' script it launches next script sequence: clean -> start -> poststart.
And there is part of 'webpack.server.config.js':
var WebpackShellPlugin = require('webpack-shell-plugin');
...
if (process.env.NODE_ENV !== 'production') {
config.plugins.push(new WebpackShellPlugin({onBuildEnd: ['nodemon build/server.js --watch build']}));
}
...
"onBuildEnd" event fires only once after first build, rebuilds are not trigger "onBuildEnd", so nodemon works as intended
I like the simplicity of nodemon-webpack-plugin
webpack.config.js
const NodemonPlugin = require('nodemon-webpack-plugin')
module.exports = {
plugins: [new NodemonPlugin()]
}
then just run webpack with the watch flag
webpack --watch
In addition to #Ling's good answer:
If you want to build your project once, before you watch it with nodemon, you can use a webpack compiler hook. The plugin's code triggers nodemon in the done hook once after webpack has finished its compilation (see also this helpful post).
const { spawn } = require("child_process")
function OnFirstBuildDonePlugin() {
let isInitialBuild = true
return {
apply: compiler => {
compiler.hooks.done.tap("OnFirstBuildDonePlugin", compilation => {
if (isInitialBuild) {
isInitialBuild = false
spawn("nodemon dist/index.js --watch dist", {
stdio: "inherit",
shell: true
})
}
})
}
}
}
webpack.config.js:
module.exports = {
...
plugins: [
...
OnFirstBuildDonePlugin()
]
})
package.json:
"scripts": {
"dev" : "webpack --watch"
},
Hope, it helps.
There's no need to use plugins here. You could try running multiple nodemon instances like below. Try modifying the following script for your use case, and see if it works for you:
"scripts": {
"start": "nodemon --ignore './public/' ./bin/www & nodemon --ignore './public/' --exec 'yarn webpack'",
"webpack": "webpack --config frontend/webpack.config.js"
}
You don't need any plugins to use webpack and nodemon, just use this scripts on your package.json
"scripts": {
"start": "nodemon --ignore './client/dist' -e js,ejs,html,css --exec 'npm run watch'",
"watch": "npm run build && node ./server/index.js",
"build": "rimraf ./client/dist && webpack --bail --progress --profile"
},
#Ling has an answer very close to being correct. But it errors the first time somebody runs watch. You'll need to modify the solution as so to prevent errors.
Run npm install npm-run-all webpack nodemon
Create a file called watch-shim.js in your root. Add the following contents, which will create a dummy file and directory if they're missing.
var fs = require('fs');
if (!fs.existsSync('./dist')) {
fs.mkdir('./dist');
fs.writeFileSync('./dist/bundle.js', '');
}
Setup your scripts as so in package.json. This will only run watch if the watch-shim.js file runs successfully. Thereby preventing Nodemon from crashing due to missing files on the first run.
{
...
"scripts": {
"start": "npm run watch",
"watch": "node watch-shim.js && npm-run-all --parallel watch:server watch:build",
"watch:build": "webpack --progress --colors --watch",
"watch:server": "nodemon \"./dist/bundle.js\" --watch \"./dist/*\""
}
...
},
Assuming nodemon server.js touch the server.js file afterEmit:
// webpack.config.js
module.exports = {
// ...
plugins: [
// ...,
// 👇
apply: (compiler) => {
compiler.hooks.afterEmit.tap('AfterEmitPlugin', (compilation) => {
require('child_process').execSync('touch server.js') // $ touch server.js
});
}
]
}
I tried most of the solution provided above. I believe the best one is to use nodemon-webpack-plugin .
It is very simple to use i.e. just add
const NodemonPlugin = require('nodemon-webpack-plugin')
to webpack file with
new NodemonPlugin() as your plugin.
Below are the scripts to use it:
"scripts": {
"watch:webpack-build-dev": "webpack --watch --mode development",
"clean-db": "rm -rf ./db && mkdir -p ./db",
"local-dev": "npm run clean-db && npm run watch:webpack-build-dev"
...
}
After this you can simply run npm run local-dev.
Adding a module to development is usually not as bad as adding to a production one. And mostly you will be using it for the development anyway.
This also doesn't require any additional package like nodemon or npm-run-all etc.
Also nodemon-webpack-plugin only works in watch mode.