How to use pnpm on Azure Pipelines?

Question

In my Nextjs project, I want to create a pipeline using Azure Pipelines. But my project uses pnpm package manager. I have read pnpm doc that only Travis, Semaphore, AppVeyor, GitHub Actions, Gitlab CI, and Bitbucket Pipelines. No Azure Pipelines documentation.

Does anyone know how to implement this?

Answer 1

I have created my own recipe for my pipelines in Azure pipelines.

Any feedback will be useful

For Nextjs

azure-pipelines.yml

variables:
  pnpm_config_cache: $(Pipeline.Workspace)/.pnpm-store

trigger:
  - main

pool:
  vmImage: ubuntu-latest

steps:
  - task: Cache@2
    inputs:
      key: 'pnpm | "$(Agent.OS)" | pnpm-lock.yaml'
      path: $(pnpm_config_cache)
    displayName: Cache pnpm

  - task: Cache@2
    inputs:
      key: next | $(Agent.OS) | pnpm-lock.yaml
      path: "$(System.DefaultWorkingDirectory)/.next/cache"
    displayName: "Cache .next/cache"

  - script: |
      curl -f https://get.pnpm.io/v6.16.js | node - add --global pnpm@7
      pnpm config set store-dir $(pnpm_config_cache)
    displayName: "Setup pnpm"

  - script: |
      pnpm install
      pnpm run build
    displayName: "pnpm install and build"

  - task: ArchiveFiles@2
    inputs:
      rootFolderOrFile: "."
      includeRootFolder: false
      archiveType: "zip"
      archiveFile: "$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip"
      replaceExistingArchive: true

  - task: PublishBuildArtifacts@1
    inputs:
      PathtoPublish: "$(Build.ArtifactStagingDirectory)"
      ArtifactName: "drop"
      publishLocation: "Container"

For other build (removed version of Nextjs part)

azure-pipelines.yml

variables:
  pnpm_config_cache: $(Pipeline.Workspace)/.pnpm-store

trigger:
  - main

pool:
  vmImage: ubuntu-latest

steps:
  - task: Cache@2
    inputs:
      key: 'pnpm | "$(Agent.OS)" | pnpm-lock.yaml'
      path: $(pnpm_config_cache)
    displayName: Cache pnpm

  - script: |
      curl -f https://get.pnpm.io/v6.16.js | node - add --global pnpm@7
      pnpm config set store-dir $(pnpm_config_cache)
    displayName: "Setup pnpm"

  - script: |
      pnpm install
      pnpm run build
    displayName: "pnpm install and build"

  - task: ArchiveFiles@2
    inputs:
      rootFolderOrFile: "."
      includeRootFolder: false
      archiveType: "zip"
      archiveFile: "$(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip"
      replaceExistingArchive: true

  - task: PublishBuildArtifacts@1
    inputs:
      PathtoPublish: "$(Build.ArtifactStagingDirectory)"
      ArtifactName: "drop"
      publishLocation: "Container"