快速入門 - 使用 Azure Pipelines 建置和發佈Node.js套件
Azure DevOps Services | Azure DevOps Server 2022 - Azure DevOps Server 2019
您可以使用 Azure DevOps 管線來建置、部署及測試 JavaScript 應用程式。
本快速入門會逐步解說如何使用管線建立具有 Node 封裝管理員 (npm) 的Node.js套件,以及發佈管線成品。
必要條件
您必須在 Azure DevOps 中具有下列專案:
1 - 派生範例程式碼
在 GitHub 派生下列範例 Express.js 伺服器應用程式。
https://github.com/Azure-Samples/js-e2e-express-server
2 - 建立管線
登入 Azure Pipelines。 您的瀏覽器將會移至
https://dev.azure.com/my-organization-name
並顯示您的 Azure DevOps 儀錶板。移至您的項目,然後選取 [管線>建立新的管線]。
選取 [GitHub ] 作為原始程式碼的位置。
如果您重新導向至 GitHub 以登入,請輸入您的 GitHub 認證。
當存放庫清單出現時,請選取您的Node.js範例存放庫。
Azure Pipelines 會分析存放庫中的程式代碼,並建議
Node.js
管線的範本。 選取該範本。Azure Pipelines 會產生管線的 YAML 檔案。 選取 [儲存並直接執行>認可至主要分支],然後選擇 [儲存並再次執行]。
新的回合隨即啟動。 等待執行完畢。
當您完成時,您的存放庫中有一個可運作的 YAML 檔案 azure-pipelines.yml ,可供您自定義。
建立管線 並選取 YAML 範本。
設定管線的 Agent 集 區和 YAML 檔案路徑 。
儲存管線並將組建排入佇列。 當組建 #nnnnnnnn.n 已排入佇列訊息時,請選取數位連結以查看管線的運作情形。
3 - 建置您的套件併發佈成品
編輯 您的 azure-pipelines.yml 檔案。
更新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'
將新工作新增至管線,以複製 npm 套件、package.json,以及發佈成品。 [ 複製檔案] 工作 會從下載原始碼檔案之代理程式的本機路徑複製檔案,並將檔案儲存至代理程式上的本機路徑,其中會先將任何成品複製到其中的代理程式,再推送至目的地。
src
只有和public
資料夾會取得複本。 [ 發佈管線成品] 工作 會從先前的 [複製檔案] 工作下載這些檔案,並讓它們以管線組建發行的管線成品的形式提供。- 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 - 執行管線
儲存並執行您的管線。 在管線執行之後,請確認作業已成功執行,且您看到已發佈的成品。
在 GitHub 派生下列存放庫。
https://github.com/Azure-Samples/js-e2e-express-server
在您自己的存放庫中有範例程式代碼之後, 請建立您的第一個管線 ,然後選取 空白進程 範本。
在管線編輯器的 [工作] 索引標籤下選取 [處理],然後變更屬性,如下所示:
- 代理程式佇列:
Hosted Ubuntu Latest
- 代理程式佇列:
以指定的順序將下列工作新增至管線:
npm \(英文\)
- 命令:
install
- 命令:
npm \(英文\)
- 顯示名稱
npm test
: - 命令:
custom
- 命令與自變數:
test
- 顯示名稱
發佈測試結果
- 保留所有屬性的預設值
封存盤案
- 要封存的根資料夾或檔案:
$(System.DefaultWorkingDirectory)
- 封存路徑前面加上根資料夾名稱: 取消核取
- 要封存的根資料夾或檔案:
發佈組建成品
- 保留所有屬性的預設值
儲存管線並將組建排入佇列,以查看其實際操作。
下一步
恭喜,您已成功完成本快速入門!
意見反應
https://aka.ms/ContentUserFeedback。
即將登場:在 2024 年,我們將逐步淘汰 GitHub 問題作為內容的意見反應機制,並將它取代為新的意見反應系統。 如需詳細資訊,請參閱:提交並檢視相關的意見反應