Я ответил на это в другом посте, но я также выложу его здесь:
Потратив много часов на это, я собираюсь расширить ответ Старианцев.Хотя в конечном итоге это помогло мне начать работать с лазурью, часть информации отсутствовала или была неверной.Итак, я собираюсь попытаться выполнить пошаговую прогулку.
Первое, что нужно отметить, это то, что я не изменяю ни один файл, чтобы заставить это работать.Если вы измените webpack.server.config.js , то при локальном build:ssr он создаст server.js в корневой папке приложения, что нежелательно.
Итак, если вы используете визуальный дизайнер Azure, вы можете выполнить следующие действия:
- Сначала подключитесь к своему хранилищу и настройте ветку, которую вы хотите использовать
- Добавьте задачу Node Tool Installer и настройте ее на использование текущей версии узла
- Добавьте задачу npm и установите команду Command на заказ;Установите команду и аргументы на
install @angular/cli -g (назовите ее "npm install angular cli") - Добавьте еще одну задачу npm , но оставьте ее при установке (назовите ее как-нибудькак "npm install пакеты")
- Добавить задачу Командная строка и установить сценарий на
npm run build:ssr (назовите его «build the project») - Добавить Копирование файлов задача, установите Исходную папку на
$(Build.SourcesDirectory)/dist, Содержание на ** и Целевую папку на $(Build.ArtifactStagingDirectory)/app/dist(назовите это что-то вроде «Копировать дистрибутивные файлы в промежуточное состояние» - Добавьте еще одну задачу Копировать файлы , установите для Исходная папка значение
$(Build.ArtifactStagingDirectory)/app/dist, Содержание до server.js и целевая папка до $(Build.ArtifactStagingDirectory)/app (назовите это как-нибудь как «Копировать server.js в корень») - Затем добавьте Удалить файлыЗадача , установите Исходную папку на
$(Build.ArtifactStagingDirectory)/app/dist и Contents на server.js (назовите это как «Delete dist / server.js» - Наконец, добавьте Azure App Service Deploy , задайте для пакета или папки значение
$(Build.ArtifactStagingDirectory)/app - Найдите Параметры преобразования файлов и замены переменных , убедитесь, что GenerateВыберите Web.config и добавьте эти параметры Web.config :
-Handler iisnode -NodeStartFile server.js -appType node
Если вы правильно следуете этому руководству, вам следует завершитьсо структурой папок, похожей на:
web.config
server.js
dist
и distпапка должна содержать еще две папки (браузер и сервер).Если это так (и так должно быть), у вас будет работающее Angular Universal приложение.
Для тех, кто хотел бы, вот yml :
queue:
name: Hosted VS2017
demands: npm
steps:
- task: NodeTool@0
displayName: 'Use Node 8.x'
inputs:
versionSpec: 8.x
- task: Npm@1
displayName: 'npm install angular cli'
inputs:
command: custom
verbose: false
customCommand: 'install @angular/cli -g'
- task: Npm@1
displayName: 'npm install packages'
inputs:
verbose: false
- script: 'npm run build:ssr'
displayName: 'build the project'
- task: CopyFiles@2
displayName: 'Copy dist files to staging'
inputs:
SourceFolder: '$(Build.SourcesDirectory)/dist'
TargetFolder: '$(Build.ArtifactStagingDirectory)/app/dist'
- task: CopyFiles@2
displayName: 'Copy server.js to the root'
inputs:
SourceFolder: '$(Build.ArtifactStagingDirectory)/app/dist'
Contents: server.js
TargetFolder: '$(Build.ArtifactStagingDirectory)/app'
- task: DeleteFiles@1
displayName: 'Delete the dist/server.js'
inputs:
SourceFolder: '$(Build.ArtifactStagingDirectory)/app/dist'
Contents: server.js
- task: AzureRmWebAppDeployment@3
displayName: 'Azure App Service Deploy: website'
inputs:
azureSubscription: 'Subscription 1'
WebAppName: website
DeployToSlotFlag: true
ResourceGroupName: Temp
SlotName: master
Package: '$(Build.ArtifactStagingDirectory)/app'
GenerateWebConfig: true
WebConfigParameters: '-Handler iisnode -NodeStartFile server.js -appType node'
UseWebDeploy: true
RemoveAdditionalFilesFlag: true
Надеюсь, это поможет кому-то еще:)