Angular na hospedagem Node

Existe algum pré-requisito para que meu site em angular funcione em uma hospedagem node?

Oi Rene!

Você precisa subir um servidor em Node.JS na porta 3000 (pode ser com Express mesmo), e setar o caminho dos arquivos estáticos dele para dentro da pasta de sua aplicação Angular.

O que eu indico é que você rode um ng build --prod localmente, para criar os artefatos da aplicação localmente, e suba esses artefatos já prontos. Daí você precisa criar uma rota que aponte a raiz do Express para a index da sua aplicação. Algo assim:

app.get(’/’, (req, res) => {

res.send(‘src/index.html’);

});

Você tem que localmente já criar a dependência do Express, e criar as rotas certinhas.

Em seu start script você já chamaria direto o “node index.js”, por exemplo, sendo o index.js o arquivo do Express, que roda na 3000 e contém as rotas.

1 curtida

Olá, estou meio perdido e precisando subir algo asap…
posso criar algo do tipo:
var express = require(‘express’);

var app = express();

app.use(’/’, express.static(‘dist/oncoclinicas-app/’))

app.listen(3000, function () {

console.log(‘Rodandoooo!’);

});

Estou tendo dificuldade pra subir o Angular…
executei ng build --prod e subi o dist para o umbler, adicionei o …-json

LOG

Nov 14 09:40:52 npm ERR! /usr/src/app/.npm/_logs/2020-11-14T12_40_52_294Z-debug.log
Nov 14 09:40:52 npm ERR! A complete log of this run can be found in:
Nov 14 09:40:52
Nov 14 09:40:52 npm WARN Local package.json exists, but node_modules missing, did you mean to install?
Nov 14 09:40:52 npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Nov 14 09:40:52 npm ERR! Failed at the iniciando-angular2-mais@0.0.0 start script.
Nov 14 09:40:52 npm ERR!
Nov 14 09:40:52 npm ERR! spawn ENOENT
Nov 14 09:40:52 npm ERR! iniciando-angular2-mais@0.0.0 start: ng serve
Nov 14 09:40:52 npm ERR! errno ENOENT
Nov 14 09:40:52 npm ERR! file sh
Nov 14 09:40:52 npm ERR! syscall spawn
Nov 14 09:40:52 npm ERR! code ELIFECYCLE
Nov 14 09:40:52 sh: 1: ng: not found
Nov 14 09:40:52
Nov 14 09:40:52 > ng serve
Nov 14 09:40:52 > iniciando-angular2-mais@0.0.0 start /usr/src/app

Parkage-json

“scripts”: {
“ng”: “ng”,
“start”: “ng serve”,
“build”: “ng build”,
“test”: “ng test”,
“lint”: “ng lint”,
“e2e”: “ng e2e”
},

Angular JSON

“serve”: {

      "builder": "@angular-devkit/build-angular:dev-server",

      "options": {

        "browserTarget": "iniciando-angular2-mais:build",

        "port":3000

      },

Opa @Lindemberg_Cortez, você não deve usar o ng serve em produção, ele só deve ser usado localmente. Essa é a primeira dica.

Sobre o seu problema, é que a pasta dist por si só não tem tudo que você precisa. Você vai precisar também subir as dependências que é a pasta node_modules, que é justamente onde o comando ngda aplicação está instalado.

Isso resolve o problema sobre não ter achado o ng, mas não resolve seu problema como um todo. O ng serve ele cria um servidor de desenvolvimento apontando para o fonte da sua pasta app, como você passou só a pasta dist você vai levantar um servidor vazio.

Nesse caso você vai precisar um servidor node que aponte para a sua aplicação na pasta dist. Tem vários exemplos na internet, sugiro procurar por algo com express por ser bem simples de fazer.

Aí no fim o seu start ficaria assim:

"start": "node server.js",

Onde o server.js é esse servidor express que aponta para o dist.

Tem um tutorial aqui na comunidade: https://community.umbler.com/br/t/hospedando-angularjs-na-umbler/455

2 curtidas