Azure DevOps 搭配 YAML 實現 CI 的設定方式

2025-06-20

筆記如何設定 Azure DevOps 的 CI 流程,使用 Nodejs 搭配 Vite 的專案為例。

logo

說明

# Node.js with Vue
# Build a Node.js project that uses Vue with Yarn.

trigger:
- staging

pool:
  name: default # Which user agent pool to use

# Install Node.js and specify the version to use.
steps:
- task: NodeTool@0
  inputs:
    versionSpec: '18.x'
  displayName: 'Install Node.js 18.x'

# It's a good practice to install Yarn itself if the agent doesn't have it.
- script: npm install -g yarn
  displayName: 'Install Yarn'
  
- script:
    yarn install
  displayName: 'Run yarn install'
  workingDirectory: 'src/MyVite.Web' # Set working directory for this project

# Important ! install and build must in seperate steps
- script:
    yarn build
  displayName: 'Run yarn build'
  workingDirectory: 'src/MyVite.Web' # Set working directory for this project

# Publish the build output as an artifact for the release pipeline
- task: PublishBuildArtifacts@1
  displayName: 'Publish Artifact: drop'
  inputs:
    PathtoPublish: '$(Build.SourcesDirectory)/src/MyVite.Web/dist' # Absolute path to the build output
    ArtifactName: 'drop' # The name of the artifact for the release pipeline
    publishLocation: 'Container' # Standard location for artifacts in Azure Pipelines