Develop Reference

'node_modules' is not recognized as an internal or external command, operable program or batch file

I am using gulp in my application.
installed gulp
put the npm script
run the script by using "npm start"
Got the error:-
**> start
node_modules/.bin/gulp watch
'node_modules' is not recognized as an internal or external command,
operable program or batch file.**
In package.json to start the script:-
"scripts": {
"start": "node_modules/.bin/gulp watch"
},
Kindly help me to fix this issue.
Thank you

When working with npm packages you do not need to specify a path to executable in node_modules. Try the following setup:
"scripts": {
"start": "gulp watch"
},
Make sure that gulp is present in dependencies as well.
"dependencies": {
"gulp": "^4.0.2"
}

I also ran into this problem while working on React/NextJs project. The way I solved it is by specifying a direct path for the scripts in the package.json folder as follows:
"scripts": {
"dev": "C:/Users/username/myFolder/NextjsProjectFolder/node_modules/.bin/next dev",
"build": "C:/Users/username/myFolder/NextjsProjectFolder/node_modules/.bin/next build",
"start": "C:/Users/username/myFolder/NextjsProjectFolder/node_modules/.bin/next start",
},
Perhaps, this could be helpful to someone working on Nextjs project.

How to modify the folder structure of app.asar when using electron-builder?

I am using create-react-app (CRA) to create and build my frontend code. My (simplified) folder structure looks like this:
package.json
node_modules/
public/
└── electron.js
└── index.html
src/
My npm scripts:
"build": {
"appId": "com.somedomain.app",
},
"scripts": {
"react-start": "react-scripts start",
"react-build": "react-scripts build",
"react-test": "react-scripts test --env=jsdom",
"react-eject": "react-scripts eject",
"electron-build": "electron-builder",
"release": "yarn react-build && electron-builder --publish=always",
"build": "yarn react-build && yarn electron-build"
}
When I run "build", the project is built and there's a build folder with everything in it, which is then used by electron to create the app.asar file. When I extract the contents, I see following structure:
package.json
node_modules/
build/
└── electron.js
└── index.html
How did electron-builder know to take the build folder from my project folder? I tried figuring it out by playing with the "build" field of my package.json like so:
"build": {
"appId": "com.somedomain.app",
"files": "app"
},
and renamed my build folder to app but then I get the following error:
⨯ Application entry file "build\electron.js" in the "[redacted][\app.asar" does not exist. Seems like a wrong configuration.
It seems as though electron still tries to run electron.js from the build folder, which now doesn't exist in app.asar.
How can I modify the file structure in the app.asar file? Does it have to contain a build folder? Ideally, I'd like have the following structure:
package.json
node_modules
electron/
└── electron.js
frontend
└── index.html
I tried modifying the "files" field some more, I tried "extraFiles" and "buildResources" but even if I can get the folder structure inside of app.asar the way I want it, I continue to get the error:
⨯ Application entry file "build\electron.js" in the "[redacted][\app.asar" does not exist. Seems like a wrong configuration.

I found out what was the problem was. Apparently, when electron-builder sees that react-scripts are in the dependencies it automatically uses a built-in configuration called react-cra. The build-in configuration for react-cra looks like this:
directories: {
buildResources: "assets"
},
files: ["build/**/*"],
extraMetadata: {
main: "build/electron.js"
}
the extraMetadata field is what caused the
⨯ Application entry file "build\electron.js" in the "[redacted][\app.asar" does not exist. Seems like a wrong configuration.
error.
To prevent using the the react-cra built-in configuration, one can add "extends": null in their package.json's "build" field. With the following configuration I got the desired result:
"build": {
"appId": "io.gueney.app",
"extends": null,
"files": [
"electron/**/*",
"frontend/**/*"
]
},

Watch template files and copy them to dist/ folder

I'm using typescript on my project and I can successfully watch + compile .ts files and output them to dist folder.
here is the scripts part of my package.json
"start": "npm run build && npm run watch",
"build": "npm run build-ts && npm run tslint",
"test": "cross-env NODE_ENV=test jest --watch",
"watch": "concurrently -k -p \"[{name}]\" -n \"Typescript,Node\" -c \"cyan.bold,green.bold\" \"npm run watch-ts\" \"npm run serve\"",
"serve": "nodemon dist/server.js",
"build-ts": "tsc",
"watch-ts": "tsc -w",
"tslint": "tslint -c tslint.json -p tsconfig.json"
The problem is I want to use js templating engine (nunjucks) and I need to watch the view files inside the views folder and move them to the dist folder.
Is there a way by just using npm scripts or nodejs?
Or do I need to use other tools like gulp or webpack?

I have the "same" request to for a CRUD graphql back-end server, but don't want to use gulp or webpack just to keep it simple.
I see that you use nodemon like me. Then, according the docs at https://github.com/remy/nodemon, it can be used it to monitor changes of any kind of file other than the default js. More over, nodemon can monitor the status of other transactional server other than node.
The first task is detecting the changes of wanted files: in my case I want copy the *.gql files in my src/schema folder to build/schema folder. For that, you can use the ext for the kind of files, and watch option for the source folder to explore.
The second one task is matter of copying the files. Naturally, you can use the copy command of your host OS. In my case I use the DOS xcopy command of the Windows shell (or cp in Unix like OS). nodemon has an "event-hook" with the event option, that can execute a command line when an event occurs. Just we need the restart event of the node server when the changes are detected for nodemon.
You can use the command line options, or a global config file, or in you local package.json project config file. I show up the last one using nodemonConfig section of package.json:
"nodemonConfig": {
"watch": [
"./src/schema",
"./build"
],
"ext": "js,gql",
"events": {
"restart": "xcopy .\\src\\schema\\*.gql .\\build\\schema /Y /O /R /F /I /V /E"
}
}

Ozkr's answer is great, I just want to add what worked for me, I had to change it a bit as nodemon was running into an infinite restart otherwise:
"nodemonConfig": {
"watch": [
"./views",
"./public"
],
"ext": "hjs,js",
"events": {
"restart": "cp -r views dist \n cp -r public dist"
}
}

copy-and-watch does just that:
I use this code to copy html files during development:
"copy_html": "yarn copy-and-watch src/mail_templates/* prod/mail_templates --watch --clean",

Run NPM script ONLY when a JS file is staged

Is there a way to run an NPM script ONLY when a JS file is staged? Specifically, after a pre-commit git hook (using Husky). I have the following scripts in my package.json:
"scripts": {
...
"test": "jest",
"precommit": "npm test",
...
},
I want to be able to only run jest if there are JS files staged. How can I achieve this?

Have you seen this?
https://github.com/okonet/lint-staged
You can configure it like so:
Add "lint-staged": { "*.js": "eslint" } to package.json

Babel - transpilation of EC6 to EC5

Currently I am running a CLI command to transpile my node_modules:
babel --presets es2015 MYDIRECTORY --out-dir transpiled
That works fine, but with a problem. When I run it, it transpiles and copies files and folder structure. It only does it for *.js files. Other files (they dont need to get transpiled) are not copied.
So originaly I have this folder structure, before transpilation (plese see image):
It does not copy other files. For one module it is ok, I cna manually copy those files. But for more complex structure it is very complex.
How can I tell Babel to do transpilaiton as it does, but also to copy other non *.js files as well.
Thank you

Create a package.json if you don't have one yet.
npm init // follow on screen instructions
Add a scripts key to the package.json with an array as value.
Into the array add a command name as key and the commands to run as value.
Example package.json with the commands you need.
To execute run: 'npm run compile'
I've added an exclude flag to the xcopy command. If you put the js extension in the exclude file, those files are excluded from copying. Remove the exclude flag to copy everything.
{
"name": "someProject",
"version": "0.0.1",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"copysrc": "XCOPY C:\\path\\to\\project\\src\\*.* C:\\path\\to\\project\\dist /S /I /Y /EXCLUDE:C:\\path\\to\\project\\xcopyexclude.txt",
"babel": "babel --presets es2015 MYDIRECTORY --out-dir transpiled",
"compile": "npm run copysrc && npm run babel"
},
"author": "someAuthor",
"license": "ISC"
}
Links:
Stackoverflow - Xcopy exclude files / extensions
NPM scripts