Npm "scripts": "start" run express and open url - node.js

I have this start params in package.json
"scripts": {
"start": "node bin/www"
},
It is running my express app when I am typing npm start.
But I want browser opened http://localhost:8081 at the same time. How can I say to start to open my local url as well?
like: "start": "node bin/www, http://localhost:8081"
So when I am typing npm satrt it runs my express app and opens the url at the same time.

As far as I know it's like writing a bash command:
// Windows
"start":"start http://localhost:8081 & node bin/www"
// Mac
"start":"open http://localhost:8081 && node bin/www"
// Linux
"start":"xdg-open http://localhost:8081 && node bin/www"

For cross-platform support use open-cli.
Install it:
npm install --save-dev open-cli
Add it to your scripts:
"start": "open-cli http://localhost:8081 && node bin/www"

You just need to use start in the right order!
"start": "npm run dev & start http://localhost:8000",
Bad
"start": "start http://localhost:8000 & npm run dev",
Good

Related

BrowserSync with Nodemon and Express Server

For the life of me I can't get Browser Sync and Nodemon to run nicely alongside my Express server. I have tried every combination I can imagine.
My Express server runs at port 5000 which I can open and view, nodemon runs when changes are made, great but the browser still doesn't 'hot refresh' so to speak. I would like for the browser window to either refresh or open a new tab after nodemon has restarted the server.
package.json scripts
"scripts": {
"start": "node app.js",
"dev": "set NODE_ENV=DEV&& nodemon app.js 5000 browser-sync start --proxy localhost:5000 -e * --ignore=node_modules --reload-delay 10 --no-ui --no-notify",
"ui": "node app.js browser-sync start nodemon app.js --port=5001 --proxy=localhost:5000 -e * --ignore=node_modules --reload-delay 10 --no-ui --no-notify",
"ui2": "nodemon start & browser-sync start --proxy 'localhost:5000' -e * --ignore=node_modules"
},
I just want to start my express server, listen for changes with nodemon then restart, then either reload browser window or launch a new one to see the changes. Please help me understand what I am missing?
In case someone has the same problem, the aha moment was when I realized I needed to open a 2nd terminal window to run browser-sync. And using the below scripts in package.json now works beautifully!
So first run npm run start/dev depending if you want server restarts on changes or not then open a 2nd terminal window and run npm run ui`. In my case my app.js is launching on port 8000.
package.json
"scripts": {
"start": "node app.js",
"dev": "nodemon -e * app.js",
"ui": "browser-sync start --proxy localhost:8000 --files=**/* --ignore=node_modules --reload-delay 10000 --no-ui --no-inject-changes"
},
app.js - const port = process.env.PORT || '8000';
This can be run (npm start) in parallel with modules "npm-run-all" or with "concurrently" (replace start: string with start_b string).
"scripts": {
"browsersync": "browser-sync start --proxy localhost:5000 --files 'public,views'",
"nodemon": "nodemon server.js",
"start_b": "concurrently --kill-others \"npm run nodemon\" \"npm run browsersync\" ",
"start": "npm-run-all -p nodemon browsersync"
},
In my system, I had problems tracking .njk files, because the browser reloaded after changing them but without actually updating changes. I had to use a nodemon.json file to add the folder (views/) and extension .njk:
{
"watch": ["server.js", "views/"],
"ext": "js, css, njk"
}

How to chain custom script in package.json to call prestart mongod?

Trying to streamline my package.json and local development with a custom script to run Nodemon. I'm currently building an app with a front and back end I need to call mongod before start and before my custom in two tabs however I'm running into an issue.
mongod will only run in the terminal if the terminal path is set to local from testing and I've read:
Correct way of starting mongodb and express?
npm starts to execute many prestart scripts
How to npm start at a different directory
How do I add a custom script to my package.json file that runs a javascript file?
I can use prestart as:
"scripts": {
"prestart": "cd && mongod",
"start": "node app",
"nodemon": "./node_modules/.bin/nodemon app"
}
but I'm not seeing how I should chain a prestart with a custom scripts. When I try to chain it with nodemon as:
"scripts": {
"prestart": "cd && mongod",
"start": "node app",
"nodemon": "cd && mongod && ./node_modules/.bin/nodemon app"
},
Nodemon is fired first than mongodb crashes in my package.json when I call Nodemon as:
npm run nodemon
How can I start mongod before starting nodemon in my development process through one command in the package.json?

How can i include server/app.js in webpack-dev-server?

I'm building a client with react and am running npm start and in package.json my scripts look like this:
"scripts": {
"start": "webpack-dev-server"
}
But i've also code other server side code in server/app.js that I want to run and if I run node app.js then that runs but i'd like server/app.js to be included with webpack-dev-server so that when I run npm start server/app.js is also run.
Is that possible? I was reading up on the various options and at this stage after the simplest.
Thx.
Update your script as follows:
"scripts": {
"start": "webpack-dev-server && node app.js"
}

nodemon to exec "prestart" script at package.json

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"
}

Debug is not a recognized command (express)

Im running express on windows 8. I ran the command
>express app
after i ran the command to install dependencies
>cd app && npm install
after i attempted to run the app using the given command
>DEBUG=my-application ./bin/www
but I received the error message
'Debug' is not recognized as an internal or external command,
operable program or batch file.
any ideas on how to fix this?
Some background info, I successfully installed node.js from their website. I attempted to install express usings the commands
>npm install
when that didnt work i followed the instuctions on this website https://coderwall.com/p/mbov6w. when that didnt work i used the following command and it worked
npm install -g express-generator#3
i also made my own package.json and app.js based off the express website and i am now stuck.
For Windows : change your start command in the package.json file to
"scripts": {
"start": "set DEBUG=my-application & node ./bin/www"
}
then you can run npm start.
There's no need to set the DEBUG environment variable in your cmd window first.
First, you must set DEBUG as a environment variable:
set DEBUG=my-application
then, you can run the app:
node bin/www
In your root folder of your project you have to run this command
For Windows:
set DEBUG=express:* & node bin/www
For windows environments you need to use SET VARIABLE for example
"scripts" : {
"start" : "SET DEBUG=app & node ./bin/www"
}
That will help you with windows env but if you want to use cross platform I recommend to install this library cross-env that library will help you to set variables for windows and linux environments.
And the json should look like this:
"scripts" : {
"start" : "cross-env DEBUG=app & node ./bin/www"
}
I was having same issue and this help me!
use this settings on your package.json
For window Users..
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "set DEBUG=app & node app.js"
},
For Mac Users
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "DEBUG=app node app.js"
},
app is your-app-name such as [app.js][server.js] etc.
Follow the following steps for windows:
Go to your application i.e. cd app
npm install
set DEBUG=app
npm start
It will start listening on port 3000 by default.
This fixed my issue :
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node src/index.js"
}
The below command is for the windows users running on Git Bash with nodemon.
"scripts": {
"start": "node index.js",
"dev": "SET DEBUG=app:* & nodemon index.js"
}

Resources