Base solution for your next web application
Open Closed

Build in Azure Devops #10876


User avatar
0
WirelessDynamics created

Dear Support team,

We have a problem in building Angular projects in Azure DevOps

here is a sample of the error.

ERROR in ./src/app/shared/common/customizable-dashboard/widgets/widget-assets-stats/widget-assets-stats.component.css?ngResource Module build failed (from ./node_modules/postcss-loader/dist/cjs.js): BrowserslistError: Unknown version 91 of android

also, the Build steps are as attached

Thanks, Mina.


6 Answer(s)
  • User Avatar
    0
    sedulen created

    @WirelessDynamics

    Did your Azure DevOps build pipeline work before and starting giving you issues now?

    While I'm probably on a different release of ANZ and ABP, I've been building and deploying with Azure DevOps Pipelines for a few years now, and it's been working well. There were a few quirks, though.

    The biggest workaround I found was to not use the built-in npm Tasks in Azure DevOps, and instead use the Command Line task, and explicitly calling the "node" command.

    Hopefully this helps. Cheers! -Brian

  • User Avatar
    0
    ismcagdas created
    Support Team

    Thanks @sedulen :)

  • User Avatar
    0
    WirelessDynamics created

    Hello,

    Thanks for your response. can we kow the command used in other tasks?

    Thanks, Mina.

  • User Avatar
    1
    sedulen created

    Hi @Mina,

    We do a lot with variables, so where you see $(...) notation, that is a build task variable. This way our pipelines can be re-used across environments. The first 4 tasks are just setup, installing the right versions of Node, Angular CLI, Yarn, and Gulp. The final 2 "script" statements are where we se the Command Line task.

    If you are comfortable reading YAML: ` steps:

    • task: NodeTool@0 displayName: 'Use Node' inputs: versionSpec: '$(BuildNodeVersion)'

    • task: Npm@1 displayName: 'Install Angular CLI' inputs: command: custom workingDir: 'src/$(ProjectName).Web.Host' verbose: false customCommand: 'install -g @angular/cli@$(BuildAngularCliVersion)'

    • task: geeklearningio.gl-vsts-tasks-yarn.yarn-task.Yarn@3 displayName: 'Yarn Install' inputs: projectDirectory: 'src/$(ProjectName).Web.Host' arguments: 'install --verbose'

    • task: geeklearningio.gl-vsts-tasks-yarn.yarn-task.Yarn@3 displayName: 'Yarn Add Gulp' inputs: projectDirectory: 'src/$(ProjectName).Web.Host' arguments: 'add gulp --dev'

    • script: 'node ./node_modules/gulp/bin/gulp build' workingDirectory: 'src/$(ProjectName).Web.Host' failOnStderr: true displayName: 'Build Gulp'

    • script: 'node --max-old-space-size=8192 ./node_modules/@angular/cli/bin/ng build --progress=false --configuration=$(BuildConfiguration) --output-path=$(Build.ArtifactStagingDirectory)/temp/wwwroot --source-map=false' workingDirectory: 'src/$(ProjectName).Web.Host' displayName: 'Build Angular' `

      I hope that helps! -Brian

  • User Avatar
    0
    ismcagdas created
    Support Team

    Thanks @sedulen :)

  • User Avatar
    0
    WirelessDynamics created

    Thanks a million @sedulen