Quando usar o 'npm start' e quando usar o 'ng serve'?

157

ng serve serve um projeto Angular através de um servidor de desenvolvimento

npm startexecuta um comando arbitrário especificado na propriedade "start" do pacote do objeto "scripts". Se nenhuma propriedade "start" for especificada no objeto "scripts", ele executará o nó server.js.

Parece que ng serveinicia o servidor incorporado enquanto npm startinicia os servidores do Nó.

Alguém pode lançar alguma luz sobre isso?

angular angular-cli

— ishandutta2007
fonte

1

Você já viu o que esse startcomando no scriptsobjeto package.jsonfaz? Por que você acha que há alguma diferença?

— jonrsharpe

205

npm startexecutará o que você definiu para o startcomando do scriptsobjeto em seu package.jsonarquivo.

Então, se é assim:

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

Então npm startserá executado ng serve.

— Puigcerber
fonte

Além disso, de acordo com a cotação que o OP já possuía: Se nenhuma propriedade "start" for especificada no objeto "scripts", ela será executada node server.js(o que falhará se esse arquivo não estiver lá).

— jonrsharpe

1

Sim, mas o angular-cli cria o comando start na inicialização, portanto, se ele não tiver modificado, deve ser o mesmo comando.

— Puigcerber

7

Nota: Usar npm starté melhor. Para usar, ng servevocê precisa instalar o angular cli globalmente ou referenciá-lo a partir da bandeja de módulos do nó.

— precisa saber é o seguinte

43

Para um projeto que está usando a CLI, você geralmente usa o ng serve. Em outros casos, você pode querer usar o npm start. Aqui a explicação detalhada:

ng servir

Servirá um projeto que é 'CLI Angular consciente', ou seja, um projeto que foi criado usando o angular CLI, particularmente usando:

ng new app-name

Portanto, se você criou um projeto usando a CLI, provavelmente desejará usar ng serve

npm start

Isso pode ser usado no caso de um projeto que não reconhece a Angular CLI (ou simplesmente pode ser usado para executar 'ng serve' para um projeto que reconhece a Angular CLI)

Como as outras respostas afirmam, este é um comando npm que executará o (s) comando (s) npm do package.json que possui o identificador 'start' e não precisa executar apenas 'ng serve'. É possível ter algo parecido com o seguinte no package.json:

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

Nesse caso, 'npm start' resultará na execução dos seguintes comandos:

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

Isso executará simultaneamente o compilador TypeScript (observando alterações de código) e o Node lite-server (que os usuários BrowserSync)

— Chris Halcrow
fonte

1

Eu acho que a única razão pela qual você recebeu votos negativos pode ser porque você repetiu mais ou menos o que foi dito na resposta marcada.

— Kostrzak

1

Prefiro que você comece com uma declaração de uma frase que me diga quando usar uma ou outra e depois siga com o que você forneceu. Eu começaria com ... Em um projeto pequeno, eles podem ser a mesma coisa, o npm start pode simplesmente executar ng serve. Quando um projeto cresce, ou são necessárias mais etapas, o npm start é o padrão npm para iniciar / executar aplicativos. Quase forneci uma resposta e, depois de ler o que você forneceu, percebeu que não havia necessidade. Sua resposta foi muito boa.

— PatS 23/03

13

Do documento

npm-start :

Isso executa um comando arbitrário especificado na propriedade "start" do pacote do objeto "scripts". Se nenhuma propriedade "start" for especificada no objeto "scripts", ele executará o nó server.js.

o que significa que ele chamará os scripts de início dentro do package.json

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

ng servir :

Fornecido por angular / angular-cli para iniciar aplicativos angular2 criados por angular-cli. Quando você instala o angular-cli, ele cria o ng.cmd em C:\Users\name\AppData\Roaming\npm(para windows) e executa"%~dp0\node.exe" "%~dp0\node_modules\angular-cli\bin\ng" %*

Então, usando npm startvocê pode fazer sua própria execução, where is ng serveis only for angular-cli

Veja também: O que acontece quando você executa o ng serve?

— vels4j
fonte

Ou ele pode dar #npm ERR! missing script: start

— 214/11 Leo

1

Há mais do que isso. Os executáveis executados são diferentes.

npm run start

executará o executável local do seu projeto, localizado em seu node_modules / .bin.

ng serve

executará outro executável que é global.

Isso significa que, se você clonar e instalar um projeto Angular criado com a versão 5 do angular-cli e sua versão global do cli for 7, poderá ter problemas com a compilação ng.

— yusuf tezel
fonte

0

Se você deseja executar o aplicativo angular portado de outra máquina sem ngcomando, edite da package.jsonseguinte maneira

"scripts": {
    "ng": "ng",
    "start": "node node_modules/.bin/ng serve",
    "build": "node node_modules/.bin/ng build",
    "test": "node node_modules/.bin/ng test",
    "lint": "node node_modules/.bin/ng lint",
    "e2e": "node node_modules/.bin/ng e2e"
  }

Por fim, execute o npm startcomando usual para iniciar a compilação do servidor.

— SM AMRAN
fonte