Краткое руководство. Создание и публикация пакета Node.js с помощью Azure Pipelines

Azure DevOps Services | Azure DevOps Server 2022 — Azure DevOps Server 2019

Конвейер Azure DevOps можно использовать для создания, развертывания и тестирования приложений JavaScript.

В этом кратком руководстве описывается, как использовать конвейер для создания пакета Node.js с помощью node диспетчер пакетов (npm) и публикации артефакта конвейера.

Необходимые компоненты

В Azure DevOps должны быть следующие элементы:

1. Создание вилки примера кода

Создайте вилку следующего примера серверного приложения Express.js в GitHub.

https://github.com/Azure-Samples/js-e2e-express-server

2. Создание конвейера

  1. Войдите в Azure Pipelines. Браузер перейдет на https://dev.azure.com/my-organization-name панель мониторинга Azure DevOps и отобразит ее.

  2. Перейдите в проект и выберите "Создать>конвейер".

  3. Выберите GitHub в качестве расположения исходного кода.

  4. Если вы перенаправлены на GitHub для входа, введите учетные данные GitHub.

  5. Когда появится список репозиториев, выберите свой Node.js пример репозитория.

  6. Azure Pipelines анализирует код в репозитории и рекомендует Node.js шаблон для конвейера. Выберите этот шаблон.

  7. Azure Pipelines создает YAML-файл для конвейера. Нажмите кнопку "Сохранить и выполнить>фиксацию" непосредственно в главной ветви, а затем нажмите кнопку "Сохранить и снова запустить".

  8. Запускается новый запуск. Дождитесь завершения задания.

По завершении у вас есть рабочий файл YAML, azure-pipelines.yml в репозитории, который готов к настройке.

  1. Создайте конвейер и выберите шаблон YAML .

  2. Задайте для конвейера путь к пулу агентов и ФАЙЛ YAML.

  3. Сохраните конвейер и очередь сборки. Когда появится сообщение о сборке #nnnnnnnn.n, выберите номерную ссылку, чтобы увидеть конвейер в действии.

3. Создание пакета и публикация артефакта

  1. Изменитефайл azure-pipelines.yml .

  2. Обновите задачу установщика инструментов Node.js, чтобы использовать Node.js версии 16 LTS.

    trigger:
    - main
    
    pool:
      vmImage: 'ubuntu-latest'
    
    steps:
    - task: UseNode@1
      inputs:
        version: '16.x'
      displayName: 'Install Node.js'
    
    - script: |
        npm install
      displayName: 'npm install'
    
    - script: |
        npm run build
      displayName: 'npm build'
    
  3. Добавьте новые задачи в конвейер для копирования пакета npm, package.json и публикации артефакта. Задача копирования файлов копирует файлы из локального пути к агенту, в котором скачиваются файлы исходного кода и сохраняют файлы в локальный путь к агенту, в который копируются артефакты, прежде чем отправлять их в место назначения. srcpublic Только папки получают копии. Задача "Опубликовать артефакт конвейера" скачивает файлы из предыдущих задач копирования файлов и делает их доступными в виде артефактов конвейера, которые будут опубликованы с помощью сборки конвейера.

    - task: CopyFiles@2
      inputs:
        sourceFolder: '$(Build.SourcesDirectory)'
        contents: |
           src/*
           public/*
        targetFolder: '$(Build.ArtifactStagingDirectory)'
      displayName: 'Copy project files'
    
    - task: PublishPipelineArtifact@1
      inputs:
        artifactName: e2e-server
        targetPath: '$(Build.ArtifactStagingDirectory)'
        publishLocation: 'pipeline'
      displayName: 'Publish npm artifact'
    

4. Запуск конвейера

Сохраните и запустите конвейер. После выполнения конвейера убедитесь, что задание успешно выполнено и отображается опубликованный артефакт.

Снимок экрана: успешный запуск конвейера с артефактом.

  1. Вилку следующего репозитория на сайте GitHub.

    https://github.com/Azure-Samples/js-e2e-express-server
    
  2. После создания примера кода в собственном репозитории создайте первый конвейер и выберите шаблон пустого процесса .

  3. Выберите "Процесс " на вкладке "Задачи " в редакторе конвейера и измените свойства следующим образом:

    • Очередь агента:Hosted Ubuntu Latest
  4. Добавьте следующие задачи в конвейер в указанном порядке:

    • npm

      • Команда.install
    • npm

      • Отображаемое имяnpm test:
      • Команда.custom
      • Команды и аргументы:test
    • Публикация результатов теста

      • Оставьте все значения по умолчанию для свойств
    • Архивные файлы

      • Корневая папка или файл для архивации:$(System.DefaultWorkingDirectory)
      • Имя предварительной корневой папки для архивных путей: Un проверка ed
    • Публикация артефактов сборки

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

Следующие шаги

Поздравляем, вы успешно завершили работу с этим руководством!