Azure部署管道在“反应脚本生成”时失败

时间:2020-05-25 16:21:09

标签: node.js azure azure-pipelines

我有一个存储库,该存储库表示Express Web App的代码,该Web应用程序在启动时会提供React前端。我尝试使用Azure管道自动化构建和部署过程。构建步骤成功,但是部署失败。存储库的设置如下:

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

这是配置文件:

client / package.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/"
}.

package.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 Pipelines Deploy中遇到的错误:

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 }

我已经尝试过手动将SSH连接到计算机中以测试“节点服务器”命令,但是由于某些原因,SSH连接已断开并且无法重新连接。如果您需要更多信息,here 是仓库

2 个答案:

答案 0 :(得分:1)

您需要在本地构建react应用,并在您的Express Webapp项目中使用build文件夹。

项目结构应如下所示:

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/

答案 1 :(得分:1)

我终于解决了这个问题:在azure-pipelines.yml文件的Stages-> Build-> Script部分中,我添加了cd client/ && npm install && cd ../,因为npm没有安装客户端所需的软件包并且正在执行npm install仅在父文件夹中,在那里解析package.json。添加完之后,一切都很好。