Angular PWA в статических веб-приложениях Azure

Question

Есть ли у кого-нибудь опыт размещения приложений Angular PWA в новом ресурсе Azure, Static Web Apps?

Я пытался изменить routes.json файл:

{
    "routes": [
        {
            "route": "/*",
            "serve": "/index.html",
            "statusCode": 200
        }
    ],
    "mimeTypes": {
        "json": "application/json",
        "webmanifest": "application/json"
    }
}

но безуспешно.

Когда я развертываю то же приложение в веб-приложении Azure с web.config

<staticContent>
  <mimeMap fileExtension="webmanifest" mimeType="application/json" />  
  <mimeMap fileExtension="json" mimeType="application/json" />           
</staticContent>

PWA можно установить.

Демо-проект есть.

Спасибо.

Answer 1

Когда мы настраиваем любое приложение для статического веб-приложения Azure, оно использует npm run buildв качестве команды по умолчанию для создания приложения. Теперь в случае приложения Angular оно использует ту же команду, которая запускается внутриng build. Но проблема здесь в том, что он не работает в режиме prod. Таким образом, мы можем настроить команду пользовательской сборки, добавивapp_build_command в файле рабочего процесса и используйте npm run build -- --prod как его ценность.

app_build_command: "npm run build -- --prod"

Вот несколько полезных ссылок:

https://docs.microsoft.com/en-us/azure/static-web-apps/front-end-frameworkshttps://docs.microsoft.com/en-us/azure/static-web-apps/github-actions-workflow

Answer 2

это сработало для меня: я попытался добавить имя переменной в переменную конвейера $deployment_token, которая является токеном развертывания в статическом веб-приложении Azure на портале Azure. Затем я создал конвейер для использования кода angular следующим образом:

      trigger:
- master

pool:
  vmImage: ubuntu-latest

steps:
- task: NodeTool@0
  inputs:
    versionSpec: '14.x'
  displayName: 'Install Node.js'

- task: AzureStaticWebApp@0
  inputs:
      app_location: "/" 
      Routes Location:"add the address of routes.json"
      app_build_command: "npm install -g @angular/cli&& npm install && ng build --prod"
       output_location: "dist"
   env:
       azure_static_web_apps_api_token: $(deployment_token)