Generator-jhipster: Update Angular dependencies to latest versions

Created on 27 Apr 2020  ยท  4Comments  ยท  Source: jhipster/generator-jhipster

Update Angular dependencies to use the latest versions.

If I run ncu (from npm-check-updates) on an app created from master, it shows quite a few dependencies that are out of date.

 @angular/common                             9.0.4  โ†’    9.1.3
 @angular/compiler                           9.0.4  โ†’    9.1.3
 @angular/core                               9.0.4  โ†’    9.1.3
 @angular/forms                              9.0.4  โ†’    9.1.3
 @angular/localize                           9.0.4  โ†’    9.1.3
 @angular/platform-browser                   9.0.4  โ†’    9.1.3
 @angular/platform-browser-dynamic           9.0.4  โ†’    9.1.3
 @angular/router                             9.0.4  โ†’    9.1.3
 @fortawesome/angular-fontawesome            0.6.0  โ†’    0.6.1
 @fortawesome/fontawesome-svg-core          1.2.26  โ†’   1.2.28
 @fortawesome/free-solid-svg-icons          5.12.0  โ†’   5.13.0
 @ng-bootstrap/ng-bootstrap                  6.0.0  โ†’    6.1.0
 @ngx-translate/core                        11.0.1  โ†’   12.1.2
 ngx-cookie                                  4.0.2  โ†’    4.1.2
 ngx-infinite-scroll                         8.0.1  โ†’    8.0.2
 rxjs                                        6.5.3  โ†’    6.5.5
 swagger-ui-dist                            3.24.3  โ†’   3.25.1
 tslib                                      1.10.0  โ†’   1.11.1
 zone.js                                    0.10.2  โ†’   0.10.3
 @angular/cli                                9.0.4  โ†’    9.1.3
 @angular/compiler-cli                       9.0.4  โ†’    9.1.3
 @ngtools/webpack                            9.0.4  โ†’    9.1.3
 @types/jest                               24.0.23  โ†’   25.2.1
 @types/node                              12.12.17  โ†’  13.13.4
 @typescript-eslint/eslint-plugin           2.11.0  โ†’   2.30.0
 @typescript-eslint/eslint-plugin-tslint    2.11.0  โ†’   2.30.0
 @typescript-eslint/parser                  2.11.0  โ†’   2.30.0
 autoprefixer                                9.7.3  โ†’    9.7.6
 codelyzer                                   5.2.0  โ†’    5.2.2
 css-loader                                  3.3.2  โ†’    3.5.3
 eslint                                      6.7.2  โ†’    6.8.0
 eslint-config-prettier                      6.7.0  โ†’   6.11.0
 eslint-loader                               3.0.3  โ†’    4.0.2
 file-loader                                 5.0.2  โ†’    6.0.0
 html-loader                                 0.5.5  โ†’    1.1.0
 html-webpack-plugin                         3.2.0  โ†’    4.2.0
 husky                                       3.1.0  โ†’    4.2.5
 jest                                       24.9.0  โ†’   25.4.0
 jest-date-mock                              1.0.7  โ†’    1.0.8
 jest-preset-angular                         8.0.0  โ†’    8.1.3
 lint-staged                                 8.2.1  โ†’   10.1.7
 merge-jsons-webpack-plugin                 1.0.20  โ†’   1.0.21
 mini-css-extract-plugin                     0.8.0  โ†’    0.9.0
 moment-locales-webpack-plugin               1.1.2  โ†’    1.2.0
 prettier                                   1.19.1  โ†’    2.0.5
 rimraf                                      3.0.0  โ†’    3.0.2
 sass                                       1.23.7  โ†’   1.26.5
 sass-loader                                 8.0.0  โ†’    8.0.2
 style-loader                                1.0.1  โ†’    1.2.0
 terser-webpack-plugin                       2.3.0  โ†’    2.3.6
 ts-loader                                   6.2.1  โ†’    7.0.1
 tslint                                      6.0.0  โ†’    6.1.2
 typescript                                  3.7.5  โ†’    3.8.3
 webpack                                    4.41.2  โ†’   4.43.0
 webpack-bundle-analyzer                     3.6.0  โ†’    3.7.0
 webpack-cli                                3.3.10  โ†’   3.3.11
 webpack-dev-server                          3.9.0  โ†’   3.10.3
 workbox-webpack-plugin                      4.3.1  โ†’    5.1.3

To test if this is an easy update, I ran the following:

ncu -u # to update all the dependencies
npm install
npm test

All tests pass. Then I started the app. It fails when running from Gradle:

```
Compiling ng-jhipster : es2015 as esm2015
/Users/mraible/hip-gradle/node_modules/base-href-webpack-plugin/build/index.js:28
compilation.hooks.htmlWebpackPluginBeforeHtmlProcessing.tapAsync('BaseHrefWebpackPlugin', function (data, callback) {
^

TypeError: Cannot read property 'tapAsync' of undefined
````

This issue seems to be related.

$$ bug-bounty $$ $100 area angular

Most helpful comment

All 4 comments

If no one is already working on this issue, I can give it a try. :smile:

make sure npm run webpack:build && npm test && npm run webpack:prod && npm start passes and also npm e2e, html-webpack-plugin has breaking changes

I've done the update, notice that I've also replaced ngx-cookie with ngx-cooke-service. ngx-cookie seems to have problems with the upgrade and it seems that ngx-cookie-service is an equivalent replacement with better support for Angular 9. Specifically with ngx-cookie we hit the following issue; https://github.com/salemdar/ngx-cookie/issues/106. :smiley:

Was this page helpful?
0 / 5 - 0 ratings

Related issues

SudharakaP picture SudharakaP  ยท  3Comments

pascalgrimaud picture pascalgrimaud  ยท  4Comments

pascalgrimaud picture pascalgrimaud  ยท  3Comments

DanielFran picture DanielFran  ยท  3Comments

ahmedeldeeb25 picture ahmedeldeeb25  ยท  3Comments