Base solution for your next web application
Open Closed

Angular CI build failing on Azure Hosted Linux #4223


User avatar
0
ajayak created

After upgrading to AspNetZero v5.0.1, Azure CI is failing for Angular app. I am able to build the solution successfully on my dev machine but the build fails on Azure Hosted Linux.

The build is successful in Hosted VS2017 but it takes 10 minutes to build whereas earlier using Hosted Linux, it only took 4 minutes to build. Can you please do something on this?

Here are the build logs on Hosted Linux:

2017-11-27T03:24:47.3233160Z ##[section]Starting: Yarn Build
2017-11-27T03:24:47.3291270Z ==============================================================================
2017-11-27T03:24:47.3305210Z Task         : Command Line
2017-11-27T03:24:47.3319800Z Description  : Run a command line with arguments
2017-11-27T03:24:47.3333960Z Version      : 1.1.3
2017-11-27T03:24:47.3348210Z Author       : Microsoft Corporation
2017-11-27T03:24:47.3367670Z Help         : [More Information](https://go.microsoft.com/fwlink/?LinkID=613735)
2017-11-27T03:24:47.3381620Z ==============================================================================
2017-11-27T03:24:47.6241110Z [command]/opt/vsts/work/_tool/yarn/1.3.2/x64/yarn-v1.3.2/bin/yarn build
2017-11-27T03:24:48.2473380Z yarn run v1.3.2
2017-11-27T03:24:48.3438480Z $ ng build --prod --no-aot

---------------------REMOVED UNNECESSORY LINES------------------------

2017-11-27T03:27:11.0117360Z 
2017-11-27T03:27:11.0142280Z ERROR in multi ./node_modules/tether/dist/css/tether.css ./node_modules/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.css ./node_modules/prismjs/themes/prism.css ./node_modules/bootstrap-timepicker/css/bootstrap-timepicker.min.css ./node_modules/bootstrap-daterangepicker/daterangepicker.css ./node_modules/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.css ./node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.css ./node_modules/bootstrap-select/dist/css/bootstrap-select.css ./node_modules/select2/dist/css/select2.css ./node_modules/rangeslider.js/dist/rangeslider.css ./node_modules/ion-rangeSlider/css/ion.rangeSlider.css ./node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css ./node_modules/dropzone/dist/dropzone.css ./node_modules/summernote/dist/summernote.css ./node_modules/bootstrap-markdown/css/bootstrap-markdown.min.css ./node_modules/animate.css/animate.min.css ./node_modules/toastr/build/toastr.css ./node_modules/jstree/dist/themes/default/style.css ./node_modules/morris.js/morris.css ./node_modules/chartist/dist/chartist.css ./node_modules/socicon/css/socicon.css ./node_modules/font-awesome/css/font-awesome.css ./node_modules/quill/dist/quill.core.css ./node_modules/quill/dist/quill.snow.css ./node_modules/famfamfam-flags/dist/sprite/famfamfam-flags.css ./node_modules/primeng/resources/primeng.min.css ./node_modules/primeng/resources/themes/bootstrap/theme.css ./node_modules/bootstrap4-datetimepicker/build/css/bootstrap-datetimepicker.min.css ./src/assets/metronic/src/vendors/line-awesome/css/line-awesome.css ./src/assets/metronic/src/vendors/flaticon/css/flaticon.css ./src/assets/metronic/src/vendors/metronic/css/styles.css ./src/assets/metronic/dist/html/default/assets/demo/default/base/style.bundle.css ./src/assets/metronic/4x/datatables/datatables.min.css ./src/assets/metronic/4x/datatables/plugins/bootstrap/datatables.bootstrap.css ./src/assets/metronic/4x/css/invoice.css ./src/assets/Jcrop/css/Jcrop.css ./src/assets/primeng/datatable/css/primeng.datatable.css ./src/assets/primeng/file-upload/css/primeng.file-upload.css ./src/assets/primeng/autocomplete/css/primeng.autocomplete.css ./src/assets/common/styles/metronic-customize.less ./src/assets/common/styles/metronic-customize-angular.less ./src/assets/metronic/4x/css/pricing.min.css ./src/app/shared/core.less ./src/app/shared/layout/layout.less ./src/assets/fonts/fonts-poppins.css ./src/assets/fonts/fonts-roboto.css ./src/styles.css
2017-11-27T03:27:11.0164420Z Module not found: Error: Can't resolve '/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.css' in '/opt/vsts/work/1/s/node_modules/@angular/cli/models/webpack-configs'
2017-11-27T03:27:11.0178290Z resolve '/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.css' in '/opt/vsts/work/1/s/node_modules/@angular/cli/models/webpack-configs'
2017-11-27T03:27:11.0191940Z   using description file: /opt/vsts/work/1/s/node_modules/@angular/cli/package.json (relative path: ./models/webpack-configs)
2017-11-27T03:27:11.0204990Z     Field 'browser' doesn't contain a valid alias configuration
2017-11-27T03:27:11.0225050Z   after using description file: /opt/vsts/work/1/s/node_modules/@angular/cli/package.json (relative path: ./models/webpack-configs)
2017-11-27T03:27:11.0243930Z     using description file: /opt/vsts/work/1/s/package.json (relative path: ./node_modules/ion-rangeSlider/css/ion.rangeSlider.css)
2017-11-27T03:27:11.0258890Z       no extension
2017-11-27T03:27:11.0272480Z         Field 'browser' doesn't contain a valid alias configuration
2017-11-27T03:27:11.0285920Z         /opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.css doesn't exist
2017-11-27T03:27:11.0300690Z       .ts
2017-11-27T03:27:11.0314890Z         Field 'browser' doesn't contain a valid alias configuration
2017-11-27T03:27:11.0334230Z         /opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.css.ts doesn't exist
2017-11-27T03:27:11.0347930Z       .js
2017-11-27T03:27:11.0360940Z         Field 'browser' doesn't contain a valid alias configuration
2017-11-27T03:27:11.0376320Z         /opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.css.js doesn't exist
2017-11-27T03:27:11.0390650Z       as directory
2017-11-27T03:27:11.0404730Z         /opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.css doesn't exist
2017-11-27T03:27:11.0419130Z [/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.css]
2017-11-27T03:27:11.0439580Z [/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.css.ts]
2017-11-27T03:27:11.0454540Z [/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.css.js]
2017-11-27T03:27:11.0468750Z [/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.css]
2017-11-27T03:27:11.0492560Z  @ multi ./node_modules/tether/dist/css/tether.css ./node_modules/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.css ./node_modules/prismjs/themes/prism.css ./node_modules/bootstrap-timepicker/css/bootstrap-timepicker.min.css ./node_modules/bootstrap-daterangepicker/daterangepicker.css ./node_modules/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.css ./node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.css ./node_modules/bootstrap-select/dist/css/bootstrap-select.css ./node_modules/select2/dist/css/select2.css ./node_modules/rangeslider.js/dist/rangeslider.css ./node_modules/ion-rangeSlider/css/ion.rangeSlider.css ./node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css ./node_modules/dropzone/dist/dropzone.css ./node_modules/summernote/dist/summernote.css ./node_modules/bootstrap-markdown/css/bootstrap-markdown.min.css ./node_modules/animate.css/animate.min.css ./node_modules/toastr/build/toastr.css ./node_modules/jstree/dist/themes/default/style.css ./node_modules/morris.js/morris.css ./node_modules/chartist/dist/chartist.css ./node_modules/socicon/css/socicon.css ./node_modules/font-awesome/css/font-awesome.css ./node_modules/quill/dist/quill.core.css ./node_modules/quill/dist/quill.snow.css ./node_modules/famfamfam-flags/dist/sprite/famfamfam-flags.css ./node_modules/primeng/resources/primeng.min.css ./node_modules/primeng/resources/themes/bootstrap/theme.css ./node_modules/bootstrap4-datetimepicker/build/css/bootstrap-datetimepicker.min.css ./src/assets/metronic/src/vendors/line-awesome/css/line-awesome.css ./src/assets/metronic/src/vendors/flaticon/css/flaticon.css ./src/assets/metronic/src/vendors/metronic/css/styles.css ./src/assets/metronic/dist/html/default/assets/demo/default/base/style.bundle.css ./src/assets/metronic/4x/datatables/datatables.min.css ./src/assets/metronic/4x/datatables/plugins/bootstrap/datatables.bootstrap.css ./src/assets/metronic/4x/css/invoice.css ./src/assets/Jcrop/css/Jcrop.css ./src/assets/primeng/datatable/css/primeng.datatable.css ./src/assets/primeng/file-upload/css/primeng.file-upload.css ./src/assets/primeng/autocomplete/css/primeng.autocomplete.css ./src/assets/common/styles/metronic-customize.less ./src/assets/common/styles/metronic-customize-angular.less ./src/assets/metronic/4x/css/pricing.min.css ./src/app/shared/core.less ./src/app/shared/layout/layout.less ./src/assets/fonts/fonts-poppins.css ./src/assets/fonts/fonts-roboto.css ./src/styles.css
2017-11-27T03:27:11.0525850Z ERROR in multi ./node_modules/tether/dist/css/tether.css ./node_modules/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.css ./node_modules/prismjs/themes/prism.css ./node_modules/bootstrap-timepicker/css/bootstrap-timepicker.min.css ./node_modules/bootstrap-daterangepicker/daterangepicker.css ./node_modules/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.css ./node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.css ./node_modules/bootstrap-select/dist/css/bootstrap-select.css ./node_modules/select2/dist/css/select2.css ./node_modules/rangeslider.js/dist/rangeslider.css ./node_modules/ion-rangeSlider/css/ion.rangeSlider.css ./node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css ./node_modules/dropzone/dist/dropzone.css ./node_modules/summernote/dist/summernote.css ./node_modules/bootstrap-markdown/css/bootstrap-markdown.min.css ./node_modules/animate.css/animate.min.css ./node_modules/toastr/build/toastr.css ./node_modules/jstree/dist/themes/default/style.css ./node_modules/morris.js/morris.css ./node_modules/chartist/dist/chartist.css ./node_modules/socicon/css/socicon.css ./node_modules/font-awesome/css/font-awesome.css ./node_modules/quill/dist/quill.core.css ./node_modules/quill/dist/quill.snow.css ./node_modules/famfamfam-flags/dist/sprite/famfamfam-flags.css ./node_modules/primeng/resources/primeng.min.css ./node_modules/primeng/resources/themes/bootstrap/theme.css ./node_modules/bootstrap4-datetimepicker/build/css/bootstrap-datetimepicker.min.css ./src/assets/metronic/src/vendors/line-awesome/css/line-awesome.css ./src/assets/metronic/src/vendors/flaticon/css/flaticon.css ./src/assets/metronic/src/vendors/metronic/css/styles.css ./src/assets/metronic/dist/html/default/assets/demo/default/base/style.bundle.css ./src/assets/metronic/4x/datatables/datatables.min.css ./src/assets/metronic/4x/datatables/plugins/bootstrap/datatables.bootstrap.css ./src/assets/metronic/4x/css/invoice.css ./src/assets/Jcrop/css/Jcrop.css ./src/assets/primeng/datatable/css/primeng.datatable.css ./src/assets/primeng/file-upload/css/primeng.file-upload.css ./src/assets/primeng/autocomplete/css/primeng.autocomplete.css ./src/assets/common/styles/metronic-customize.less ./src/assets/common/styles/metronic-customize-angular.less ./src/assets/metronic/4x/css/pricing.min.css ./src/app/shared/core.less ./src/app/shared/layout/layout.less ./src/assets/fonts/fonts-poppins.css ./src/assets/fonts/fonts-roboto.css ./src/styles.css
2017-11-27T03:27:11.0548460Z Module not found: Error: Can't resolve '/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css' in '/opt/vsts/work/1/s/node_modules/@angular/cli/models/webpack-configs'
2017-11-27T03:27:11.0562220Z resolve '/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css' in '/opt/vsts/work/1/s/node_modules/@angular/cli/models/webpack-configs'
2017-11-27T03:27:11.0577880Z   using description file: /opt/vsts/work/1/s/node_modules/@angular/cli/package.json (relative path: ./models/webpack-configs)
2017-11-27T03:27:11.0595070Z     Field 'browser' doesn't contain a valid alias configuration
2017-11-27T03:27:11.0615450Z   after using description file: /opt/vsts/work/1/s/node_modules/@angular/cli/package.json (relative path: ./models/webpack-configs)
2017-11-27T03:27:11.0644750Z     using description file: /opt/vsts/work/1/s/package.json (relative path: ./node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css)
2017-11-27T03:27:11.0669600Z       no extension
2017-11-27T03:27:11.0694840Z         Field 'browser' doesn't contain a valid alias configuration
2017-11-27T03:27:11.0718850Z         /opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css doesn't exist
2017-11-27T03:27:11.0742200Z       .ts
2017-11-27T03:27:11.0761720Z         Field 'browser' doesn't contain a valid alias configuration
2017-11-27T03:27:11.0778740Z         /opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css.ts doesn't exist
2017-11-27T03:27:11.0792520Z       .js
2017-11-27T03:27:11.0806640Z         Field 'browser' doesn't contain a valid alias configuration
2017-11-27T03:27:11.0820170Z         /opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css.js doesn't exist
2017-11-27T03:27:11.0834800Z       as directory
2017-11-27T03:27:11.0848930Z         /opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css doesn't exist
2017-11-27T03:27:11.0868090Z [/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css]
2017-11-27T03:27:11.0900780Z [/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css.ts]
2017-11-27T03:27:11.0914760Z [/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css.js]
2017-11-27T03:27:11.0929800Z [/opt/vsts/work/1/s/node_modules/ion-rangeSlider/css/ion.rangeSlider.skinFlat.css]

2017-11-27T03:27:11.0978030Z error Command failed with exit code 1.
2017-11-27T03:27:11.0991540Z info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
2017-11-27T03:27:11.1105470Z ##[error]/opt/vsts/work/_tool/yarn/1.3.2/x64/yarn-v1.3.2/bin/yarn failed with return code: 1
2017-11-27T03:27:11.1147940Z ##[error]/opt/vsts/work/_tool/yarn/1.3.2/x64/yarn-v1.3.2/bin/yarn failed with error: /opt/vsts/work/_tool/yarn/1.3.2/x64/yarn-v1.3.2/bin/yarn failed with return code: 1
2017-11-27T03:27:11.1201590Z ##[section]Finishing: Yarn Build

12 Answer(s)
  • User Avatar
    0
    ismcagdas created
    Support Team

    Hi @ajayak,

    Can you check if yarn install angular v5.x and abp-ng2-module 1.3.0 ?

  • User Avatar
    0
    ajayak created

    Hi @ismcagdas,

    I checked yarn logs but it is not printing installed packages information in the console. Here are complete yarn installlogs:

    2017-12-01T13:30:31.5473480Z ##[section]Starting: Yarn Install
    2017-12-01T13:30:31.5535220Z ==============================================================================
    2017-12-01T13:30:31.5548640Z Task         : Command Line
    2017-12-01T13:30:31.5563740Z Description  : Run a command line with arguments
    2017-12-01T13:30:31.5576590Z Version      : 1.1.3
    2017-12-01T13:30:31.5590600Z Author       : Microsoft Corporation
    2017-12-01T13:30:31.5604860Z Help         : [More Information](https://go.microsoft.com/fwlink/?LinkID=613735)
    2017-12-01T13:30:31.5617460Z ==============================================================================
    2017-12-01T13:30:31.8352310Z [command]/opt/vsts/work/_tool/yarn/1.3.2/x64/yarn-v1.3.2/bin/yarn
    2017-12-01T13:30:33.8253130Z yarn install v1.3.2
    2017-12-01T13:30:34.0928290Z [1/4] Resolving packages...
    2017-12-01T13:30:34.9367270Z [2/4] Fetching packages...
    2017-12-01T13:30:34.9431890Z warning Pattern ["esprima-fb@~3001.0001.0000-dev-harmony-fb"] is trying to unpack in the same destination "/usr/local/share/.cache/yarn/v1/npm-esprima-fb-3001.1.0-dev-harmony-fb-b77d37abcd38ea0b77426bb8bc2922ce6b426411" as pattern ["esprima-fb@~3001.1.0-dev-harmony-fb"]. This could result in a non deterministic behavior, skipping.
    2017-12-01T13:30:47.8762470Z warning [email protected]: Unable to read "./man" directory of module "json2"
    2017-12-01T13:30:47.9948740Z warning [email protected]: Unable to read "./man" directory of module "joosex-simplerequest"
    2017-12-01T13:30:48.7314710Z warning [email protected]: Unable to read "./man" directory of module "joose"
    2017-12-01T13:30:48.7687110Z warning [email protected]: Unable to read "./man" directory of module "joosex-namespace-depended"
    2017-12-01T13:31:21.8878930Z info [email protected]: The platform "linux" is incompatible with this module.
    2017-12-01T13:31:21.8907180Z info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
    2017-12-01T13:31:21.9064700Z [3/4] Linking dependencies...
    2017-12-01T13:31:21.9246540Z warning " > [email protected]" has incorrect peer dependency "bootstrap@^3.1.1".
    2017-12-01T13:31:21.9280750Z warning " > [email protected]" has incorrect peer dependency "[email protected]".
    2017-12-01T13:31:21.9308410Z warning " > [email protected]" has incorrect peer dependency "bootstrap@^3.3".
    2017-12-01T13:31:21.9340190Z warning " > [email protected]" has incorrect peer dependency "moment-timezone@^0.4.0".
    2017-12-01T13:31:21.9365700Z warning "js-url > [email protected]" has unmet peer dependency "grunt@>=0.4.0".
    2017-12-01T13:31:21.9394360Z warning " > [email protected]" has incorrect peer dependency "@angular/core@^2.4.2".
    2017-12-01T13:31:21.9418790Z warning " > [email protected]" has incorrect peer dependency "@angular/core@^2.4.2".
    2017-12-01T13:31:21.9486270Z warning " > [email protected]" has unmet peer dependency "npm@>=3.10.8".
    2017-12-01T13:32:17.0806650Z [4/4] Building fresh packages...
    2017-12-01T13:32:54.7818580Z Done in 140.97s.
    2017-12-01T13:32:54.9075290Z ##[section]Finishing: Yarn Install
    
  • User Avatar
    0
    ismcagdas created
    Support Team

    Hi @ajayak,

    Do you just run "yarn build" command ? I haven't tried it before. We always use "ng build --prod".

    If you are running "yarn build", does it run any internal npm command ?

  • User Avatar
    0
    ajayak created

    Hi @ismcagdas,

    yarn build runs "ng build --prod --no-aot"

  • User Avatar
    0
    ajayak created

    Hi @ismcagdas,

    I see that running "ng build --prod" is taking a lot of time. For me, on Azure it takes ~6-10 minutes which is too damn high! Can you suggest some way to reduce this build time?

  • User Avatar
    0
    bbakermmc created

    You can always modify whats in your packages to remove things you dont need. The other option is to bloat your repository with all the packages when you check in (remove them from the git ignore) then you dont need to do any npm installs, not sure if this will be faster since your build server would still need to download the files, though if its a local machine it might be faster.

    For me it takes 7-10min to build on our hosted box at MS. Thats with doing a full package install and making new min js/css.

  • User Avatar
    0
    ajayak created

    Hi @BBakerMMC,

    That's the problem right there. It should not take 7-10 minutes to make a build!

    AspNetZero 4.6 took only 4 minutes to install and build packages. Now it has significantly increased to ~11 minutes to do the same things. Also, I see that 1044 chunk files are produced in the build.

  • User Avatar
    0
    bbakermmc created

    I mean maybe 10min isnt acceptable for your org to make builds, but for ours its perfectly fine. After its built it will get deployed to the proper site (pending approvals for some). I just looked at our build times and its 5.2min for v 4.6, and 7min for v5. In the v5 I also run the guilpFile which adds 1.5min, if I took t his out our builds would be roughly the same. I see the npm takes maybe 20seconds longer than bower did.

    Im not sure what you are expecting to happen. This is a packaged product, you dont like it, you dont have to use it, but since you have the source code you and modify it will. You dont like that it includes all the extra JS bloat then take it out :) Make sure you share the code though so I can copy it, we use DevExtreme for everything so we dont need any of the extra JS they package, so we plan to strip it out and re-make all their base pages using the DevExtreme features when we have time, but its not a huge issue for us since all the features that the end users would see are using DevExtreme and anything an admin person would configure is in their jtables or whatever.

    Note: we dont use angular so maybe there is extra packages/times I dont know about.

  • User Avatar
    0
    ajayak created

    Hi @BBakerMMC,

    Yeah, we always have the freedom to remove all the unnecessary packages to improve the build time. I think I have to stick with the current setup until all the dependencies of my project are frozen. Once my project gets in beta, I'll strip down all unwanted packages :)

    Thanks.

  • User Avatar
    0
    ismcagdas created
    Support Team

    Hi @ajayak,

    The reason of increased chunck count is angular locales. In the latest version, angular v5, angular team decided to include only en-us locale in the application. Because of that, we had to include other locales by ourselfs and it caused this unwanted behaviour. Maybe it is not that bad actually, it provides faster app load/run time for us :).

    By the way, hav eyou solved your main problem ? you can try to include --build-optimizer=false int your build command to make build time faster but I'm not sure if you want to do that.

    I think you are talking about different projects because gulp file is in MVC & JQuery template, just a quick note :).

  • User Avatar
    0
    ajayak created

    Hi @ismcagdas and @@BBakerMMC,

    The build time has drastically reduced from 90 minutes to 15 minutes in the 5.1.1 Dev branch.

    Thanks AspNetZero team.

  • User Avatar
    0
    ismcagdas created
    Support Team

    @ajayak Thanks. It is the success of angular-cli team actually. I think 15 minutes is still high but angular-cli team is making performance enhancements very often.