ASP.NET Core + Angular 使用 Azure DevOps 发布管道部署 Artifact

Question

我用 Angular 创建了一个 asp.net 核心项目。所以它是 1 个单一应用程序而不是两个应用程序。

我的问题如下：

我应该select部署哪个package/folder？ Dist 文件夹或 zip 文件？或者名为“artifactnametest”的文件夹？

Answer 1

您应该改为发布您的 asp 网络核心应用程序。

这是我们其中一个项目的示例构建文件。这仅适用于 asp.net 核心。对于 angular 应用程序，我们在不同的任务中做了一些额外的事情，例如运行 npm install，但原理是相同的。

# ASP.NET Core (.NET Framework)
# Build and test ASP.NET Core projects targeting the full .NET Framework.
# Add steps that publish symbols, save build artifacts, and more:
# https://docs.microsoft.com/azure/devops/pipelines/languages/dotnet-core

trigger:
- master

pool:
  vmImage: 'windows-latest'

variables:
  solution: '**/*.sln'
  buildPlatform: 'Any CPU'
  buildConfiguration: 'Release'
  runtime: 'win-x64'

steps:
- task: NuGetToolInstaller@1

# Restore all nuget packages and .net core tools
- task: DotNetCoreCLI@2
  inputs:
    command: 'custom'
    projects: '**/*.csproj'
    custom: 'restore'
    arguments: '-r $(runtime)'

# Build projects
- task: DotNetCoreCLI@2
  inputs:
    command: 'build'
    projects: '**/*.csproj'
    arguments: '-c $(BuildConfiguration) --no-restore -r $(runtime)'

# Publish all projects to /staging/ci-build/<ProjectName>/
- task: DotNetCoreCLI@2
  inputs:
    command: 'publish'
    publishWebProjects: false
    projects: |
      **/*Client.csproj
      **/*WorkerService.csproj
      **/*Server.csproj
    arguments: '-c $(BuildConfiguration) -o $(Build.StagingDirectory)/ci-build --no-build --self-contained -r $(runtime)'
    zipAfterPublish: false

# Archive the /staging/ci-build folder to /staging/RemoteData.<BuildNumber>
- task: ArchiveFiles@2
  inputs:
    rootFolderOrFile: '$(Build.StagingDirectory)/ci-build'
    includeRootFolder: false
    archiveType: 'zip'
    archiveFile: '$(Build.ArtifactStagingDirectory)/RemoteData.$(Build.BuildNumber).zip'
    replaceExistingArchive: true

# Publish the zipfile as artifact
- task: PublishBuildArtifacts@1
  inputs:
    PathtoPublish: '$(Build.ArtifactStagingDirectory)/RemoteData.$(Build.BuildNumber).zip'
    ArtifactName: 'RemoteData.$(Build.BuildNumber)'
    publishLocation: 'Container'

Answer 2

我已经使用 Dotnet Build 和 NPM build 完成了这个实现。首先进行 NPM 构建并生成一个 dist 文件夹。然后进行 asp.net 构建。构建完成后，将文件复制到 Build.artifactstagingdirectory。同样，对于 NPM dist，将文件夹从工作目录复制到要保持不变的文件夹内的暂存目录。然后你可以压缩整个暂存目录并发布它。下面是示例代码片段。您可以将其替换为 DotNetCore@2 task

而不是 MsBuild

    trigger:
        branches:
          include:
          - master
      
    pool:
      name: Azure Pipelines
      vmImage: 'windows-2019'
      demands:
        - npm
        - msbuild
        - visualstudio
    
    variables: 
      configuration: release
      BuildConfiguration: "Release"
      platform: x64
    
    stages:
    - stage: Build
      jobs:
      - job: Build
        steps:
        - task: NuGetToolInstaller@0
          displayName: 'Use NuGet 4.4.1'
          inputs:
            versionSpec: 4.4.1
        - task: NuGetCommand@2
          displayName: 'NuGet restore'
          inputs:
            restoreSolution: '$(Parameters.solution)'
            vstsFeed: '34356gsgv643a'
        - task: Npm@1
          displayName: 'npm install'
          inputs:
            workingDir: angularfoldername
            verbose: false
        - task: Npm@1
          displayName: 'npm custom'
          inputs:
            command: custom
            workingDir: angularfoldername
            verbose: false
            customCommand: 'run build'
        - task: MSBuild@1
          displayName: 'Build solution dotnet.csproj'
          inputs:
            solution: dotnet.csproj
            msbuildArguments: '/t:build /p:outputpath="$(build.artifactstagingdirectory)" /property:langversion=latest'
        - task: DotNetCoreCLI@2
          displayName: Test
          inputs:
            command: test
            projects: '$(Parameters.TestProjects)'
            arguments: '--configuration $(BuildConfiguration)'
        - task: CopyFiles@2
          displayName: 'Copy Files to: $(build.artifactstagingdirectory)\_PublishedWebsites\dotnet\angularfolder'
          inputs:
            SourceFolder: 'angularfoldername'
            Contents: '**'
            TargetFolder: '$(build.artifactstagingdirectory)\_PublishedWebsites\dotnet\angularfoldername'
           - task: PublishBuildArtifacts@1
          displayName: 'Publish Artifact: drop'
          inputs:
            PathtoPublish: '$(Build.ArtifactStagingDirectory)\_PublishedWebsites'

Answer 3

Which package/folder should I select to deploy? the Dist folder or the zip file? Or the folder named "artifactnametest"?

我同意 prasun 的观点。我们可以将 NPM dist 文件夹从工作目录复制到暂存目录，然后压缩整个暂存目录并发布它。

或者，我们可以在发布管道中添加两个工件来部署 Dist 文件夹和 zip 文件：

您可以查看此文档 Create a build pipeline for Angular and ASP.NET Core apps with Visual Studio Team Services 了解一些详细信息。

ASP.NET Core + Angular 使用 Azure DevOps 发布管道部署 Artifact

ASP.NET Core + Angular deploy Artifact with Azure DevOps release pipeline

asp.net-core

azure-pipelines

azure-pipelines-release-pipeline

angular