When to use "npm start" and when to use "ng serve"?

Question

ng serve serves for Angular project through development server

npm start starts an arbitrary command specified in the "start" package property of its "scripts" object. If the "start" property is not specified on the "scripts" object, it will start node server.js.

It seems that ng serve starts the embedded server, while npm start starts the node servers.

Can someone shed light on him?

Answer 1

npm start will do everything you defined for the start command of the scripts object in your package.json file.

So, if it looks like this:

 "scripts": { "start": "ng serve" } 

Then npm start will start ng serve .

Answer 2

For a project that uses the CLI, you will usually use ng serve. In other cases, you can use npm start. Here is a detailed explanation:

ng serve

It will serve the Angular CLI-oriented project, i.e. a project created using the Angular CLI, especially using:

 ng new app-name 

So, if you created a project using the CLI, you probably want to use ng serve

the beginning of the evening

This can be used in the case of a project that does not support the Angular CLI (or it can simply be used to run "ng serve" for a project that knows the Angular CLI)

As the other answers say, this is an npm command that will run the npm command from package.json with the identifier "start", and it should not just run "ng serve". In package.json, there might be something like the following:

  "scripts": { "build:watch": "tsc -p src/ -w", "serve": "lite-server -c=bs-config.json", "start": "concurrently \"npm run build:watch\" \"npm run serve\"" ... }, "devDependencies": { "concurrently": "^3.2.0", "lite-server": "^2.2.2", 

In this case, npm start will execute the following commands:

 concurrently "npm run build:watch" "npm run serve" 

This will simultaneously launch the TypeScript compiler (tracking code changes) and start the Node lite server (which uses BrowserSync)

Answer 3

From document

npm-start :

This starts an arbitrary command specified in the property of the "start" package of its "scripts" object. If the "start" property is not specified in the "scripts" object, it will start the server.js node.

this means that it will invoke start scripts in package.json

 "scripts": { "start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite --baseDir ./app --port 8001\" ", "lite": "lite-server", ... } 

ng serve :

Angular / angular-cli is provided to run angular2 applications created by angular-cli. when installing angular-cli, it will create the ng.cmd file in the C:\Users\name\AppData\Roaming\npm folder (for windows) and execute "%~dp0\node.exe" "%~dp0\node_modules\angular-cli\bin\ng" %*

Thus, using npm start you can do your own execution, where ng serve only for angular-cli.

See also: What happens when you start ng serve?

Answer 4

There is more than that. The executables are different.

 npm run start 

will run the local executable of your project, which is located in your node_modules / .bin.

 ng serve 

will run another executable file that is global.

This means that if you clone and install an Angular project created using angular-cli version 5, and your global cli version is 7, then you may have problems with ng build.

Answer 5

You must use ng serve, therefore npm start is a script that will run the same. A more efficient way is to directly call ng serve through a running but unnecessary script