Azure CI/CD管道Angular 故障

v440hwme 于 2022-12-27 发布在 Angular

关注(0)|答案(3)|浏览(238)

随着一个新的建设，我设置，我似乎不能得到一个坚实的工作yaml设置。
我试图建立一个Angular 的项目，并将其作为一个工件发布。
这是我的想法：

- script: |
    npm install -g @angular/cli
    npm install
    npm uninstall @angular-devkit/build-angular
    npm install @angular-devkit/build-angular
    ng build --prod

- task: Npm@1
  displayName: 'Build Angular'
  inputs:
    command: custom
    workingDir: 'Mpw/Mpw.Web.UI/ClientApp'
    verbose: false
    customCommand: 'run build'
    
- task: CopyFiles@2
  displayName: 'Copy dist to artifacts'
  inputs:
    SourceFolder: 'test/test.UI/ClientApp/dist'
    Contents: '**'
    TargetFolder: 'test/test.UI/ClientApp/dist'
    cleanTargetFolder: true

- task: PublishBuildArtifacts@1
  displayName: 'Publish Artifacts'
  inputs:
    PathtoPublish: '$(Build.ArtifactStagingDirectory)/Application'
    ArtifactName: 'test-uat'

但是我在管道上得到了以下错误输出：

2021-12-20T11:55:12.7224058Z [command]C:\Windows\system32\cmd.exe /D /S /C ""C:\Program Files\nodejs\npm.cmd" run build"
2021-12-20T11:55:18.9961043Z Node packages may not be installed. Try installing with 'npm install'.
2021-12-20T11:55:18.9961498Z 
2021-12-20T11:55:18.9962153Z Could not find the '@angular-devkit/build-angular:browser' builder's node package.
2021-12-20T11:55:18.9962748Z > client-app@0.0.0 build
2021-12-20T11:55:18.9963084Z > ng build
2021-12-20T11:55:18.9963194Z 
2021-12-20T11:55:19.1210342Z ##[warning]Couldn't find a debug log in the cache or working directory
2021-12-20T11:55:19.1215101Z ##[error]Error: Npm failed with return code: 1
2021-12-20T11:55:19.1221947Z ##[section]Finishing: Build Angular

我不确定我的Yaml是否100%正确

Azure

来源：https://stackoverflow.com/questions/70421486/azure-ci-cd-pipeline-angular-failing

3条答案

按热度按时间

ekqde3dh1#

可能未安装节点程序包。请尝试使用"npm install"进行安装。

更新节点和Angular CLI版本
使用命令npm install npm@latest和npm install @angular/cli@latest

在缓存或工作目录中找不到调试日志
对npm任务"install gulp -g"使用以下命令
找不到"@angular-devkit/build-angular：browser "生成器的节点包。
安装@angular-devkit/build-angular作为开发依赖项。

npm install --save-dev @angular-devkit/build-angular

或者，

yarn add @angular-devkit/build-angular --dev

升级问题

删除这些文件/文件夹（从Angular根文件夹）：
package-lock.json（不是软件包. json）
/node_modules文件夹
/dist文件夹
执行命令（重新生成package-lock.json和/node_modules）：
$npm install

正是package-lock.json导致npm下载旧版本的依赖项。

赞(0）回复(0）举报 2022-12-27

vlju58qv2#

- tl; dr;：**如果你得到这个错误Could not find the '@angular-devkit/build-angular:browser' builder's node package.，尝试把你的YAML文件放在根目录下。我后来能够重命名文件为azure-pipelines-production.yaml，它仍然工作。

嗨，@Bike_dotnet，我在这件事上挣扎得很厉害;我一共运行了10个管道，管道YAML文件保存在pipelines文件夹中，我花了无数个小时试图弄清楚为什么构建不能只在Angular 解决方案上工作，而只能使用ng build --configuration production;我甚至在版本14和15中生成了两个默认的Angular项目...我使用了相同的脚本，但没有效果，出现了相同的错误，每次都在许多管道上，跨越不同的Azure DevOps帐户和不同的默认项目以及我的生产就绪项目。
最后，我生成了一个新的默认管道脚本，我发现它是由微软创建的，它与我以前尝试过的脚本完全相同...但这次我将脚本保存在根文件夹中，并将名称默认为azure-pipelines.yml ...就像变魔术一样...它工作了，使用了生产配置和所有内容!我希望这能帮助到一些人。
这是可行的：

pool:
  vmImage: ubuntu-latest

steps:
- task: NodeTool@0
  inputs:
    versionSpec: '16.18.x'
  displayName: 'Install Node.js'

- script: |
    npm install -g @angular/cli@14.2.10
    npm ci
    ng build --configuration production
  displayName: 'npm install and build'

赞(0）回复(0）举报 2022-12-27

vsikbqxv3#

我认为您错过了节点安装任务。
按照以下安装说明操作：https://learn.microsoft.com/en-us/azure/devops/pipelines/ecosystems/javascript?view=azure-devops&tabs=code

赞(0）回复(0）举报 2022-12-27