Make npm start script run ng serve in a particular port - node.js

I have some scripts in my package.json, and I need to know how to get the start script to correctly accept the -port parameter for angular-cli.
"scripts": {
"ng": "ng",
"start": "ng serve --proxy-config proxy.conf.json",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
We need this because we would like to run multiple instances of our software simultaneously. Currently, if I have one project running on the default port 4200, and try to run npm start -port 4300 in a second terminal window, I get, "Port 4200 is already in use. Use '--port' to specify a different port."
What can I do to get my build to run in a particular port? And how can I make it so that I can pass the port number into the npm start script from the command line?

If you add "--" the parameters are passed through:
npm start -- --port 4301

Change it as,
"scripts": {
"ng": "ng",
"start": "ng serve --port 4301",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},

You can try this command:
npm run start -- -p 4300

Related

Nodejs Ionic-Angular deployed to Heroku displays only the backend, instead of launching the whole app

My package.json:
"scripts": {
"ng": "ng",
"start": "node src/app.js && ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"main": "src/app-routing.module.ts"
},
I moved the devdependencies to dependencies.
Apps run locally with Heroku local web but display the only backend in the server.
Added a procfile containing web: npm start
Heroku assigns a port and the database is successfully connected. Backend works fine
My project structure: A src/ folder that has both my back end and frontend files.
I guess I am losing out on the project structure. Please help to make me display the frontend of the app instead of backend.
okay , 1)add the following to your app.js (or your server.js), and
app_path ='../www';
app.use('/api', songRoute)
app.use('/',express.static(path.join(__dirname,app_path)))
app.get('*',(req,res)=>res.sendFile(path.join(__dirname,app_path + '/index.html')))
2)To package.json add this,
"heroku-postbuild":"ng build --configuration=production",

React command on yarn start and also init server with same command

I'm trying to attach another command to yarn start. I'm not sure if it is possible but when I run command yarn start I want my react app to start and I also want to fire up my server at the same time.
What I do know is use 2 terminals one with react app directory and call on yarn start
C:\Users\ivanr\Documents\GitHub\bees\business-scheduler>
and one with server directory (which is inside react app directory) and call on node src/index.js
C:\Users\ivanr\Documents\GitHub\bees\business-scheduler\server>
"scripts": {
"start": "react-scripts start", // is it possible that I can say in server directory run node src/index.js here?
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
You can use concurrently
First install it
$ npm install concurrently
Then use it in your command
"scripts": {
"start": "concurrently \"yarn start-client\" \"yarn start-server\"",
"start-client": "react-scripts start",
"start-server": "cd .\server && node src/index.js"
}
You can use npm-run-all
"scripts": {
"clean": "rimraf dist",
"lint": "eslint src",
"build": "babel src -o lib"
}
npm-run-all clean lint build

Autostart node.js app with startup options

I would like to autostart my node.js application and server with every boot of the Windows Server 2016 OS.
I already found "node-windows" and "qckwinsvc" as possible solutions, but I do not understand how I can start my application with the startup options I saved in the package.json provided below (e.g. host, prod, ip, max-old-space-size, etc.)
Furthermore, I would like to know if these services also restart the node application in case it crashed due to a programmatical error (e.g. javascript heap out of memory)
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build --prod --base-href ./",
"build-dev": "ng build --base-href ./",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"app": "ng serve --host=0.0.0.0 --prod --open",
"app-dev": "ng serve --host=localhost --open",
"server": "export NODE_ENV=production && export IP=172.28.0.19 && node --max-old-space-size=4096 server/server.ts",
"server-dev": "export NODE_ENV=development && export IP=localhost && node server/server.ts",
"static": "http-server ./dist/lead -p 8080 -a 0.0.0.0 -o",
"static-dev": "~/.node/lib/node_modules/http-server/bin/http-server ./dist/lead -p 4200 -a localhost -o",
"format": "tslint --fix \"./src/app/**/*.ts\" && tslint --fix \"./server/**/*.ts\" && prettier --write \"./src/app/**/*.{ts,json,css,html}\" && prettier --write \"./server/**/*.ts\" && ng lint"
},
The perfect solution would be to autostart the server and application with all provided startup options and also restart the application in case of a crash.
Would be very thankful for any kind of help :)
dotenv is a popular library for environment params management. You can start your app like this NODE_ENV=prod node app.js and can access this value from your app like this process.env.NODE_ENV.

access to resource not allowed on login

I can access first screen for login though after it returns access not allowed to local resource
it works well in browser
( I am able to run my project in angular well in a web browser but because it is a desktop application I have to use electron, when I build to run in electron, it starts well, displays login but when I press login instead of returning display it return a white screen and in console, access to resource not allowed
main.js
win.loadURL(url.format({
pathname: path.join(__dirname, './angular_build/index.html'),
protocol:'file:',
slashes: true
}));
package.json
"version": "0.0.0",
"main": "main.js",
"build": {
"directories": {
"output": "release/"
}
},
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"electron": "electron .",
"electron-build": "ng build --prod && electron ."
},

How to fix "curl (56) Recv failure: Connection reset by peer" error when doing a port mapping from docker container to host machine?

I have a Angular Project running in a docker container at port 4200. I have done a port mapping from docker container's 4200 port to my localhost 4200.
I am running this on Ubuntu 16.04. When doing netstat -nltp, I get output
tcp6 0 0 :::4200 :::* LISTEN
My Dockerfile looks like :
FROM node
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
COPY package.json /usr/src/app
RUN npm cache clean --force
RUN npm install
COPY . /usr/src/app
EXPOSE 4200
CMD ["npm","start"]
I expected when running curl :::4200, to show me the webpage sourcecode instead of the error,
curl (56) Recv failure: Connection reset by peer
Changing the following in package.json for my angular project did the trick.
BEFORE
{
"name": "client",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
}
AFTER
{
"name": "client",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve --host 0.0.0.0",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
Follow this link for further details
Perform a port mapping when running the container for the first time as
docker run -ti --name angular angular_image:latest -p 4200:4200
This will override the EXPOSE command in the dockerfile. In real docker would have allocated a random port mapping from the container to the host machine. So, it is necessary to have a port mapping the docker cli.

Resources