Azure Конвейер развертывания не работает при "сборке сценариев реакции"

Question

У меня есть репозиторий, который представляет код для Express веб-приложения, которое при запуске обслуживает интерфейс React. Я пробовал автоматизировать процесс сборки и развертывания с помощью конвейеров Azure. Этап сборки завершается успешно, но развертывание не выполняется. Репо настроено так:

my_app/
├── client/
│   ├── src/
│   ├── package.json
│   └── index.js
├── package.json
├── server.js
└── azure-pipelines.yml

А вот файлы конфигурации:

клиент / пакет. json

{
  "name": "client",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-scripts": "3.4.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "proxy": "http://localhost:5001/"
}.

пакет. json:

{
  "name": "my-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "cd client/ && npm install && npm run build && cd ../",
    "start": "npm install && node server",
    "build": "cd client/ && npm install && npm run build && cd ../",
    "dev": "node server"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "body-parser": "^1.19.0",
    "dotenv": "^8.2.0",
    "express": "^4.17.1"
  }
}

azure -pipelines.yml:

trigger:
- master

variables:

  # Azure Resource Manager connection created during pipeline creation
  azureSubscription: 'my_sub_id'

  # Web app name
  webAppName: 'my_app_name'

  # Environment name
  environmentName: 'my_env_name'

  # Agent VM image name
  vmImageName: 'ubuntu-latest'

stages:
- stage: Build
  displayName: Build stage
  jobs:  
  - job: Build
    displayName: Build
    pool:
      vmImage: $(vmImageName)

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

    - script: |
        npm install
        npm run build --if-present
        npm run test --if-present
      displayName: 'npm install, build and test'



    - task: ArchiveFiles@2
      displayName: 'Archive files'
      inputs:
        rootFolderOrFile: '$(System.DefaultWorkingDirectory)'
        includeRootFolder: false
        archiveType: zip
        archiveFile: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
        replaceExistingArchive: true

    - upload: $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
      artifact: drop

- stage: Deploy
  displayName: Deploy stage
  dependsOn: Build
  condition: succeeded()
  jobs:
  - deployment: Deploy
    displayName: Deploy
    environment: $(environmentName)
    pool: 
      vmImage: $(vmImageName)
    strategy:
      runOnce:
        deploy:
          steps:            
          - task: AzureWebApp@1
            displayName: 'Azure Web App Deploy: referee-management-tool'
            inputs:
              azureSubscription: $(azureSubscription)
              appType: webAppLinux
              appName: $(webAppName)
              runtimeStack: 'NODE|10.10'
              package: $(Pipeline.Workspace)/drop/$(Build.BuildId).zip
              startUpCommand: 'npm run start'

Ошибка, которую я получить в Azure Развертывание конвейеров:

2020-05-25T15:56:53.2620824Z Error: Cannot find module '../scripts/build'
2020-05-25T15:56:53.2621190Z Require stack:
2020-05-25T15:56:53.2626302Z - /tmp/8d800c3a4e8367c/client/node_modules/.bin/react-scripts
2020-05-25T15:56:53.2627240Z     at Function.Module._resolveFilename (internal/modules/cjs/loader.js:982:15)
2020-05-25T15:56:53.2627901Z     at Function.resolve (internal/modules/cjs/helpers.js:83:19)
2020-05-25T15:56:53.2628870Z     at Object.<anonymous> (/tmp/8d800c3a4e8367c/client/node_modules/.bin/react-scripts:31:23)
2020-05-25T15:56:53.2629532Z     at Module._compile (internal/modules/cjs/loader.js:1158:30)
2020-05-25T15:56:53.2630113Z     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1178:10)
2020-05-25T15:56:53.2630662Z     at Module.load (internal/modules/cjs/loader.js:1002:32)
2020-05-25T15:56:53.2631232Z     at Function.Module._load (internal/modules/cjs/loader.js:901:14)
2020-05-25T15:56:53.2631841Z     at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12)
2020-05-25T15:56:53.2632406Z     at internal/main/run_main_module.js:18:47 {
2020-05-25T15:56:53.2633045Z   code: 'MODULE_NOT_FOUND',
2020-05-25T15:56:53.2633823Z   requireStack: [ '/tmp/8d800c3a4e8367c/client/node_modules/.bin/react-scripts' ]
2020-05-25T15:56:53.2634320Z }

Я уже пробовал S SH -ing на машине, чтобы проверить команду «сервер узла» вручную, но по какой-то причине S SH соединение было прервано, и мне не удалось восстановить соединение. Если вам нужна дополнительная информация здесь это репо

Answer 1

Я наконец решил эту проблему: в файле azure-pipelines.yml в разделе Stages-> Build-> Script я добавил cd client/ && npm install && cd ../, потому что npm не устанавливал пакеты, необходимые клиенту, и выполнял npm install только в родительской папке, парсинг пакета. json там. После добавления этого все было нормально.

Answer 2

Вам необходимо создать приложение React локально и использовать папку сборки в вашем express проекте webapp.

Структура проекта должна выглядеть так:

my_app/
├── client/
│   ├── build/
│       ├── reat_built_files
│           
├── package.json
├── server.js
└── azure-pipelines.yml

Ссылка:

https://devblogs.microsoft.com/premier-developer/deploying-react-apps-to-azure-with-azure-devops/