Опубликуйте приложение angular как артефакт, каков путь для публикации?

#angular #azure-devops #azure-pipelines

Вопрос:

Я пытаюсь создать конвейер azure, который создаст приложение angular и перенесет его в хранилище больших двоичных объектов azure. До сих пор у меня есть трубопровод, который имеет следующий YAML :

 steps:
- task: NodeTool@0
  displayName: 'Use Node 14.x'
  inputs:
    versionSpec: 14.x
    checkLatest: true

steps:
- task: Npm@1
  displayName: 'Install angular CLI'
  inputs:
    command: custom
    verbose: false
    customCommand: 'install @angular/cli@11.2.10'

steps:
- task: Npm@1
  displayName: 'npm install'
  inputs:
    verbose: true

steps:
- task: Npm@1
  displayName: 'npm build'
  inputs:
    command: custom
    verbose: false
    customCommand: 'run build'

steps:
- script: 'node bundle.js'
  displayName: 'Bundle JS'

steps:
- task: Npm@1
  displayName: 'npm run tests'
  inputs:
    command: custom
    verbose: false
    customCommand: 'run test -- --watch=false --code-coverage'

steps:
- task: PublishTestResults@2
  displayName: 'Publish Test Results'
  inputs:
    testResultsFiles: '**/TESTS-*.xml'
    failTaskOnFailedTests: true
 

Теперь я думаю, что мне нужно опубликовать встроенные файлы JS, которые находятся в корне в папке elements. Поэтому я попробовал выполнить эту задачу, но, похоже, она не может найти папку «Элементы» :

 steps:
- task: PublishBuildArtifacts@1
  displayName: 'Publish Artifact'
  inputs:
    PathtoPublish: '$(System.DefaultWorkingDirectory)/bin/elements/*'
    ArtifactName: InsuranceCalculatorBuildArtifact
 

Каким должен быть мой путь к публикации, чтобы найти папку с выводимыми элементами?

Ответ №1:

В вашем YAML есть очевидная синтаксическая ошибка, из-за которой вы добавляете слишком много дополнительных steps ключей для каждой задачи.

Обычно в одном задании есть только один steps ключ, и под steps ключом находится список задач, которые необходимо выполнить в задании.

Ниже приведена базовая структура задания в трубопроводе YAML:

 jobs:
- job:
  . . .
  steps:
  - task: task1
  - task: task2
  - task: task3
  . . .
 

Чтобы просмотреть более подробную информацию, вы можете просмотреть «Задание» и «Шаги» в документе «Ссылка на схему YAML«.

В вашем случае, если вы хотите опубликовать артефакты сборки вашего приложения в больших двоичных объектах хранилища Azure, вы можете попробовать использовать задачу копирования файлов Azure.

  1. Если шаг сборки и шаг публикации выполняются в одном и том же задании, это означает, что эти шаги выполняются в рамках работы непосредственно на одной и той же машине агента. Таким образом, вы можете напрямую публиковать артефакты сборки из пути, по которому они были созданы.

    Например:

 jobs:
- job: BuildAndPublish
  steps:
  - task: NodeTool@0
    displayName: 'Use Node 14.x'
    inputs:
      ...

  - task: Npm@1
    displayName: 'Install angular CLI'
    inputs:
      ...

  - task: Npm@1
    displayName: 'npm install'
    inputs:
      ...

  - task: Npm@1
    displayName: 'npm build'
    inputs:
      ...

  - script: 'node bundle.js'
    displayName: 'Bundle JS'

  - task: Npm@1
    displayName: 'npm run tests'
    inputs:
      ...

  - task: PublishTestResults@2
    displayName: 'Publish Test Results'
    inputs:
      ...

  - task: AzureFileCopy@4
    displayName: 'Publush to Azure storage blobs'
    inputs:
      ...
 
  1. Если этап сборки и этап публикации находятся в разных заданиях, вы можете выполнить следующие действия:
    • В задании, в котором выполняется этап сборки, после этапа сборки используйте задачу Опубликовать артефакты сборки, чтобы опубликовать артефакты сборки в конвейерах Azure с пути, по которому были созданы артефакты.
    • В задании, в котором выполняется этап публикации, перед этапом публикации используйте задачу Загрузить артефакты сборки, чтобы загрузить артефакты сборки из конвейеров Azure по указанному пути в рабочем каталоге задания.
    • Затем используйте задачу копирования файлов Azure, чтобы опубликовать артефакты сборки по указанному пути в больших двоичных объектах хранилища Azure.

    Например:

 jobs:
- job: Build
  steps:
  - task: NodeTool@0
    displayName: 'Use Node 14.x'
    inputs:
      ...

  - task: Npm@1
    displayName: 'Install angular CLI'
    inputs:
      ...

  - task: Npm@1
    displayName: 'npm install'
    inputs:
      ...

  - task: Npm@1
    displayName: 'npm build'
    inputs:
      ...

  - script: 'node bundle.js'
    displayName: 'Bundle JS'

  - task: Npm@1
    displayName: 'npm run tests'
    inputs:
      ...

  - task: PublishTestResults@2
    displayName: 'Publish Test Results'
    inputs:
      ...

  - task: PublishBuildArtifacts@1
    displayName: 'Publish Artifact'
    inputs:
      ...

- job: Publish
  steps:
  - task: DownloadBuildArtifacts@0
    displayName: Download Artifact'
    inputs:
      ...

  - task: AzureFileCopy@4
    displayName: 'Publush to Azure storage blobs'
    inputs:
      ...
 

Ответ №2:

Вам нужно будет скопировать папку /dist в артефакты, а затем опубликовать

учитывая мои переменные

 variables:
    projectRoot: 'src'
    artifactName: 'drop'
 

Вот как выглядит моя публикация

 - task: CopyFiles@2
    displayName: 'Copy dist to artifacts'
    inputs:
        SourceFolder: '$(projectRoot)/dist'
        Contents: '**'
        TargetFolder: '$(build.artifactstagingdirectory)/dist'
        cleanTargetFolder: true

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

Комментарии:

1. Это «$(projectRoot)/dist», в котором я не уверен. Или это просто так, $(projectRoot) ? Если нет, я не уверен, как захватить корень проекта?

2. В корне моего проекта находится мой файл package.json, расположенный в корне моего репозитория. Я использую это место для запуска команды установки npm, а затем команды сборки, которая выводится в папку src/dist. это похлопывание по корню в вашей папке, для меня это всего лишь 1 папка в глубину.