为什么天蓝色构建管道不为角度构建生成 dist 文件夹答案

【问题标题】：why is azure build pipeline not generating a dist folder for an angular build为什么天蓝色构建管道不为角度构建生成 dist 文件夹
【发布时间】：2020-07-30 14:45:35
【问题描述】：

在我可以运行任何其他任务 dist 文件夹之前，似乎在构建期间生成的文件夹已被删除。

 trigger:
    - master
    
    pool: default
    
    steps:
    - task: NodeTool@0
      inputs:
        versionSpec: '10.x'
      displayName: 'Install Node.js'
    
    - script: |
        npm install -g @angular/cli
        npm install
        ng build --prod 
      displayName: 'npm install and build'
    
    #i added this task and it seems like the node_modules and the dist 
    #folder that was generated during the build are not getting copied to the (a)directory 
    #only the source code get copied. it seems like the folders are getting
    #deleted even before the #PublishPipelineArtifact@1 task ran
    
    - task: PublishPipelineArtifact@1
      inputs:
        targetPath: '$(Pipeline.Workspace)/s'
        publishLocation: 'pipeline'

我也尝试在中输出构建

【问题讨论】：

你用的是什么代理？您还可以在发布管道任务之前插入它吗？这将递归地吐出文件夹的输出，因此可以确认 npm install 确实在工作：'-powershell: Get-ChildItem -Path '/home/vsts/work/1' -recurse'
我使用的是 Windows 10。我安装了 npm 并安装了 cli
我正在我的机器上运行一个自托管代理 == 操作系统是 Windows 10，当我在 azure 上使用 ubuntu 代理运行它时，一切似乎都运行良好，但是当使用 Windows 运行它时-最新我的本地代理遇到了同样的问题，没有生成 dist 文件夹
指定 vmImage:'ubuntu-latest' 为我工作，无法让它在 Windows 代理上工作。
@forX 我得到通过问题的方式是使用 powershell 在 Windows 代理上进行构建。那是我的工作 - 任务：PowerShell@2 输入：targetType：'inline' 脚本：| # 在此处编写您的 PowerShell 命令。 npm install -g @angular/cli npm install ng build --prod

标签： azure-devops azure-pipelines azure-yaml-pipelines

【解决方案1】：

首先将npm install 脚本与ng build 脚本分开。其次，我运行的是npm build 而不是 ng build。我花了几个小时才注意到。这解决了我的 dist 文件夹没有被创建的问题。

- script: |
    npm install
  displayName: 'npm install'

- script: |
    ng build --prod
  displayName: 'ng build'

【讨论】：

【解决方案2】：

我遇到了同样的问题，我找不到 dist 文件夹，但似乎我只是在 CopyFiles@2 任务的 dist 前面丢失了 ./。

以下是 Angular 应用程序的开发/主分支的工作构建管道。

trigger:
- main
- dev

pool:
  vmImage: ubuntu-latest

jobs:
  - job: 'Dev_build'
    condition: and(succeeded(), eq(variables['build.sourceBranch'], 'refs/heads/dev'))
    steps:
    - task: NodeTool@0
      inputs:
        versionSpec: '16.x'
      displayName: 'Install Node.js'

    - script: |
        npm install -g @angular/cli
        npm install
        ng build --configuration test
      displayName: 'npm install and build'

  # Used to diagnostic the file structure
  #  - task: Bash@3
  #    inputs:
  #      targetType: 'inline'
  #      script: 'find -name node_modules -prune -o -print'
  
    - task: CopyFiles@2
      inputs:
        SourceFolder: './dist'
        Contents: '**'
        TargetFolder: '$(build.artifactstagingdirectory)'

    - task: PublishBuildArtifacts@1
      displayName: 'Publish Artifact'
      inputs:
        PathtoPublish: '$(build.artifactstagingdirectory)'
        ArtifactName: 'www'


  - job: 'Prod_build'
    condition: and(succeeded(), eq(variables['build.sourceBranch'], 'refs/heads/main'))
    steps:
    - task: NodeTool@0
      inputs:
        versionSpec: '16.x'
      displayName: 'Install Node.js'

    - script: |
        npm install -g @angular/cli
        npm install
        ng build --configuration --production
      displayName: 'npm install and build'

    - task: CopyFiles@2
      inputs:
        SourceFolder: './dist'
        Contents: '**'
        TargetFolder: '$(build.artifactstagingdirectory)'

    - task: PublishBuildArtifacts@1
      displayName: 'Publish Artifact'
      inputs:
        PathtoPublish: '$(build.artifactstagingdirectory)'
        ArtifactName: 'www'

【讨论】：