Как добавить серверный рендеринг в проект Angular Universal

Помогите, пожалуйста, разобраться, как использовать серверный рендеринг в Angular Universal.

Что я сделал. Я посетил официальный сайт Angular Universal. Настройте Node.js. Скачал рекомендованный проект Angular 2 Webpack Starter. Я работаю на Mac, поэтому используйте "> sudo npm install" для установки node_modules. Добавьте server.js, как рекомендуется. Запустите "> node server.js" - но это не сработает.

Если я запускаю "> npm start", сервер запускается на localhost: 3000, но, похоже, серверный рендеринг отсутствует. Если я смотрю на HTML-страницу, там только Angular index.html.

Что мне делать, чтобы добавить в проект возможности серверного рендеринга?

Большое спасибо.


angular-universal server-rendering
person Kirill Ch    schedule 18.02.2017    source источник
comment
Я нашел хороший стартовый проект на github.com/angular/universal-starter   -  person Kirill Ch    schedule 24.02.2017

Ответы (4)


arrow_upward
1
arrow_downward

простой способ - клонировать исходный код приведенной ниже ссылки и прочитать документацию о том, как запустить проект github angular universal

scotch.io

person MostafaMashayekhi    schedule 21.02.2017

arrow_upward
1
arrow_downward

А пока вы можете ознакомиться с этим примером приложения (Angular 4.0.0, универсальная поддержка, Webpack и многое другое) https://github.com/ng-seed/universal

Определенно даст вам более или менее представление о том, как запустить его.

person Burak Tasci    schedule 29.03.2017

arrow_upward
1
arrow_downward

Начиная с Angular 7 вы можете запускать эту команду CLI

ng add @nguniversal/express-engine --clientProject yourprojectname

эта команда выполняет всю работу и вносит все файлы и изменения файлов, необходимые для работы Angular Universal.

затем создайте приложение,

npm run build:ssr

затем запустите сервер с помощью этой команды (порт по умолчанию - 4000)

npm run serve:ssr

И теперь ваш проект Angular 7 теперь использует Angular Universal.

Что касается Angular 6, вы можете использовать это руководство, чтобы сделать сайт универсальным.

https://github.com/angular/angular-cli/wiki/stories-universal-rendering

Связанная вики, по сути, все пишет вручную по сравнению с выполнением команд, указанных выше.

Или, как уже упоминал Кирилл, вы также можете просто скачать стартовый проект.

person TotenKopf    schedule 19.04.2019

arrow_upward
0
arrow_downward

Я нашел решение. Я загрузил хороший стартовый проект на github.com/angular/universal-starter с серверным рендерингом. служба поддержки.

person Kirill Ch    schedule 27.06.2017