Универсальная угловая ошибка (SSR): не удалось найти представление «index» в каталоге представлений

Question

Я хочу развернуть свое угловое универсальное приложение на aws.

Насколько я понимаю, я могу развернуть свое приложение только на эластичном бобовом стебле, потому что для его работы требуется веб-сервер.(Это означает, что развертывание S3 не требуется).

При развертывании приложения возникает следующая ошибка:

Ошибка: не удалось найти представление "index" в каталоге представлений "/ var/ app / current / dist / browser "в Function.render (/var/app/current/server.js:122227:17) в ServerResponse.render (/var/app/current/server.js:131120:7) в/var/app/current/server.js:138:9 на Layer.handle [как handle_request] (/var/app/current/server.js:124007:5) на следующем (/ var / app / current / server).js: 123755: 13) в Route.dispatch (/var/app/current/server.js:123730:3) в Layer.handle [как handle_request] (/var/app/current/server.js:124007:5)в /var/app/current/server.js:123230:22 в параметре (/var/app/current/server.js:123303:14) в параметре (/var/app/current/server.js:123314:14)

Вот что я сделал на данный момент:

1. В моем угловом проекте создайте производственную сборку с помощью команды npm run build:ssr
2. Создатьархив моего каталога dist
3. На Elastic Beanstalk создайте новое приложение с узлом.js и загрузите мой архив

И мой server.ts файл:

import 'zone.js/dist/zone-node';
import 'reflect-metadata';
import { enableProdMode } from '@angular/core';
// Express Engine
import { ngExpressEngine } from '@nguniversal/express-engine';
// Import module map for lazy loading
import { provideModuleMap } from '@nguniversal/module-map-ngfactory-loader';

import * as express from 'express';
import { join } from 'path';

// Faster server renders w/ Prod mode (dev mode never needed)
enableProdMode();

// Express server
const app = express();

const PORT = process.env.PORT || 4000;
const DIST_FOLDER = join(process.cwd(), 'dist/browser');

// * NOTE :: leave this as require() since this file is built Dynamically from webpack
const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require('./dist/server/main');

// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
app.engine('html', ngExpressEngine({
  bootstrap: AppServerModuleNgFactory,
  providers: [
    provideModuleMap(LAZY_MODULE_MAP)
  ]
}));

app.set('view engine', 'html');
app.set('views', DIST_FOLDER);

// Example Express Rest API endpoints
// app.get('/api/**', (req, res) => { });

// Server static files from /browser
app.get('*.*', express.static(DIST_FOLDER, {
  maxAge: '1y'
}));

// All regular routes use the Universal engine
app.get('*', (req, res) => {
  res.render('index', { req });
});

// Start up the Node server
app.listen(PORT, () => {
  console.log(`Node Express server listening on http://localhost:${PORT}`);
});

Что я делаю не так?

Спасибо за помощь.

Answer 1

Тем временем я нашел решение для развертывания на Elastic Beanstalk.

Ниже приведены различные шаги, которые я сделал:

1. В вашем приложении Elastic Beanstalk , отредактируйтеSoftware Configuration, изменив команду узла на node dist/server.js

2. Изменить порт, используемый nodejs (2 варианта):

   a.Вы можете просто отредактировать порт в вашем файле server.ts с помощью 8081 (соответствует порту nodejs, используемому в конфигурации nginx по умолчанию)

   const PORT = process.env.PORT || 8081;
   

   b. ИЛИ вы можете редактировать конфигурацию nginx с помощью файла конфигурации .ebextensions , чтобы соответствовать порту, используемому в вашем универсальном угловом приложении (по умолчанию 4000)

Answer 2

Используйте папку dist в качестве архива вместо содержимого папки dist.

Установите следующую настройку 'команды узла' в конфигурации эластичного beanstalk.

node dist/server

Это должно позволить вам работать локально и на AWS EB со стандартной настройкой Angular из коробки.