Ionic, Angular version compatibility/update give blank screen and

Hey everyone,

I recently started updating my company’s project’s capacitor. Along the way I updated Angular and Ionic package versions.

I 've come to a point where the project compiles with npm run start and I get this error in the browser’s console which seems a bit cryptic:

[webpack-dev-server] Server started: Hot Module Replacement disabled, Live Reloading enabled, Progress disabled, Overlay enabled. (in polyfill.js: 12)
   Error: NG0908
      at new yr (main.js:23:165954)
      at nD (main.js:23:227385)
      at t.bootstrapModuleFactory (main.js:23:227397)
      at main.js:23:228815

I find it quite hard to figure out what would be the issue so I hoping for your insight.
I can only guess that it could be a version compatibility between the packages since the original project was using Capacitor 1 beta & Angular 7.

I am a Vue dev and not at all familiar with Angular so nothing is obvious and any input could be helpful :slight_smile:
Let me know if any additional info would be helpfull. Unfortunately, I cannot share the repo.

Here is my package.json in case it could be something obvious or at least a starting point.

{
  "name": "projectName",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "https://ionicframework.com/",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "update": "ng update"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^16.2.10",
    "@angular/cdk": "^16.2.9",
    "@angular/common": "^16.2.10",
    "@angular/core": "^16.2.10",
    "@angular/forms": "^16.2.10",
    "@angular/material": "^16.2.9",
    "@angular/platform-browser": "^16.2.10",
    "@angular/platform-browser-dynamic": "^16.2.10",
    "@angular/router": "^16.2.10",
    "@awesome-cordova-plugins/camera": "6.4.0",
    "@awesome-cordova-plugins/core": "6.4.0",
    "@awesome-cordova-plugins/file": "6.4.0",
    "@awesome-cordova-plugins/file-transfer": "6.4.0",
    "@capacitor/android": "^5.5.0",
    "@capacitor/cli": "^5.5.0",
    "@capacitor/core": "^5.5.0",
    "@capacitor/ios": "^5.5.0",
    "@capacitor/keyboard": "5.0.6",
    "@ionic-native/camera": "^5.36.0",
    "@ionic-native/core": "^5.36.0",
    "@ionic-native/crop": "^5.36.0",
    "@ionic-native/file": "^5.36.0",
    "@ionic-native/file-path": "^5.36.0",
    "@ionic-native/file-transfer": "^5.36.0",
    "@ionic-native/image-picker": "^5.36.0",
    "@ionic-native/ionic-webview": "^5.36.0",
    "@ionic-native/photo-library": "^5.36.0",
    "@ionic-native/splash-screen": "^5.36.0",
    "@ionic-native/status-bar": "^5.36.0",
    "@ionic/angular": "^6.7.5",
    "@ionic/angular-server": "^6.7.5",
    "@ionic/storage": "^4.0.0",
    "@ionic/storage-angular": "^4.0.0",
    "@ngx-translate/core": "^15.0.0",
    "@ngx-translate/http-loader": "^8.0.0",
    "cordova-browser": "7.0.0",
    "cordova-plugin-camera": "7.0.0",
    "cordova-plugin-device": "^2.1.0",
    "cordova-plugin-file": "^8.0.0",
    "cordova-plugin-file-transfer": "2.0.0",
    "cordova-plugin-photo-library": "2.3.1",
    "cordova-plugin-splashscreen": "^6.0.2",
    "cordova-plugin-statusbar": "^3.0.0",
    "cordova-plugin-telerik-imagepicker": "git+https://github.com/Telerik-Verified-Plugins/ImagePicker.git",
    "cordova-sqlite-storage": "6.1.0",
    "core-js": "^3.33.1",
    "date-fns": "2.30.0",
    "ionic-img-viewer": "^2.9.0",
    "ionic-tags-input": "^0.1.2",
    "ionic2-auto-complete": "^1.6.2-alpha",
    "ios": "0.0.1",
    "localforage": "^1.10.0",
    "ngx-chips": "3.0.0",
    "rxjs": "~7.8.1",
    "tslib": "^2.6.2",
    "zone.js": "^0.13.3"
  },
  "devDependencies": {
    "@angular-devkit/architect": "~0.1602.7",
    "@angular-devkit/build-angular": "~16.2.7",
    "@angular-devkit/core": "~16.2.7",
    "@angular-devkit/schematics": "~16.2.7",
    "@angular/cli": "^16.2.7",
    "@angular/compiler": "~16.2.10",
    "@angular/compiler-cli": "~16.2.10",
    "@angular/language-service": "~16.2.10",
    "@ionic/angular-toolkit": "~10.0.0",
    "@types/jasmine": "~5.1.1",
    "@types/jasminewd2": "~2.0.12",
    "@types/node": "^20.8.7",
    "jasmine-core": "~5.1.1",
    "jasmine-spec-reporter": "~7.0.0",
    "karma": "~6.4.2",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage-istanbul-reporter": "~3.0.3",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "^2.1.0",
    "ts-node": "~10.9.1",
    "tslint": "~5.20.1",
    "typescript": "^4.9.5"
  },
  "description": "An Ionic project"
}

This is the output of: npm run start

home/app$ npm run start

> projectName@0.0.1 start
> ng serve

Workspace extension with invalid name (defaultProject) found.
****************************************************************************************
This is a simple server for use in testing or debugging Angular applications locally.
It hasn't been reviewed for security issues.

DON'T USE IT FOR PRODUCTION!
****************************************************************************************
One or more browsers which are configured in the project's Browserslist configuration will be ignored as ES5 output is not supported by the Angular CLI.
Ignored browsers: chrome 60
✔ Browser application bundle generation complete.

Initial Chunk Files   | Names                                                          |   Raw Size | Estimated Transfer Size
main.js               | main                                                           |    1.14 MB |               257.88 kB
styles.css, styles.js | styles                                                         |  248.72 kB |                43.14 kB
polyfills.js          | polyfills                                                      |  125.64 kB |                30.55 kB
runtime.js            | runtime                                                        |    3.20 kB |                 1.49 kB

                      | Initial Total                                                  |    1.51 MB |               333.05 kB

Lazy Chunk Files      | Names                                                          |   Raw Size | Estimated Transfer Size
6501.js               | swiper-bundle-28080340-js                                      |   97.16 kB |                23.38 kB
polyfills-core-js.js  | polyfills-core-js                                              |   91.89 kB |                27.81 kB
5962.js               | -                                                              |   81.60 kB |                 8.46 kB
9555.js               | pages-project-single-page-single-module                        |   74.55 kB |                14.79 kB
7059.js               | -                                                              |   68.74 kB |                11.87 kB
5487.js               | -                                                              |   48.23 kB |                 4.65 kB
566.js                | -                                                              |   43.45 kB |                 9.42 kB
6304.js               | -                                                              |   34.38 kB |                 5.64 kB
3672.js               | -                                                              |   28.51 kB |                 4.91 kB
8577.js               | -                                                              |   28.13 kB |                 6.89 kB
1372.js               | -                                                              |   26.13 kB |                 5.00 kB
3998.js               | -                                                              |   24.20 kB |                 3.79 kB
8891.js               | -                                                              |   24.19 kB |                 4.77 kB
9731.js               | pages-my-board-page-my-board-module                            |   23.11 kB |                 4.45 kB
185.js                | -                                                              |   22.61 kB |                 5.69 kB
7666.js               | -                                                              |   22.16 kB |                 4.62 kB
4087.js               | -                                                              |   21.70 kB |                 3.41 kB
9420.js               | -                                                              |   21.52 kB |                 3.77 kB
9882.js               | -                                                              |   21.47 kB |                 3.58 kB
8382.js               | -                                                              |   20.43 kB |                 4.65 kB
4090.js               | -                                                              |   20.36 kB |                 3.12 kB
5454.js               | -                                                              |   19.08 kB |                 1.86 kB
polyfills-dom.js      | polyfills-dom                                                  |   18.05 kB |                 5.04 kB
9218.js               | pages-questions-questions-module                               |   16.58 kB |                 3.42 kB
6642.js               | -                                                              |   16.54 kB |                 3.37 kB
common.js             | common                                                         |   16.38 kB |                 4.55 kB
6754.js               | -                                                              |   16.34 kB |                 4.24 kB
4530.js               | -                                                              |   15.70 kB |                 2.86 kB
8866.js               | -                                                              |   15.29 kB |                 2.96 kB
9857.js               | -                                                              |   15.03 kB |                 2.74 kB
3734.js               | -                                                              |   14.55 kB |                 2.52 kB
7176.js               | pages-explore-page-explore-module                              |   13.86 kB |                 3.46 kB
505.js                | -                                                              |   13.55 kB |                 2.31 kB
5421.js               | -                                                              |   12.36 kB |                 4.10 kB
3150.js               | -                                                              |   11.61 kB |                 2.10 kB
8484.js               | -                                                              |   11.50 kB |                 2.62 kB
5675.js               | -                                                              |   11.34 kB |                 3.59 kB
6792.js               | pages-step-page-step-module                                    |   11.23 kB |                 3.10 kB
1315.js               | -                                                              |   11.15 kB |                 1.37 kB
4764.js               | -                                                              |   11.15 kB |                 3.80 kB
4458.js               | -                                                              |   10.71 kB |                 2.58 kB
9820.js               | -                                                              |    9.40 kB |                 2.05 kB
3483.js               | -                                                              |    8.87 kB |                 2.12 kB
7635.js               | -                                                              |    8.44 kB |                 1.96 kB
895.js                | pages-notifications-notifications-module                       |    8.39 kB |                 2.48 kB
593.js                | pages-location-location-module                                 |    7.70 kB |                 2.09 kB
8808.js               | -                                                              |    7.54 kB |                 2.65 kB
9992.js               | -                                                              |    7.42 kB |                 2.09 kB
8262.js               | pages-register-register-module                                 |    7.37 kB |                 2.14 kB
2329.js               | pages-login-login-module                                       |    7.14 kB |                 2.11 kB
433.js                | -                                                              |    6.52 kB |                 1.79 kB
8432.js               | tabs-tabs-module                                               |    6.50 kB |                 1.73 kB
9793.js               | -                                                              |    6.38 kB |                 1.29 kB
8289.js               | -                                                              |    6.20 kB |                 1.48 kB
174.js                | pages-forgot-password-forgot-password-module                   |    6.12 kB |                 1.90 kB
5138.js               | pages-notification-notification-module                         |    6.11 kB |                 1.98 kB
9588.js               | -                                                              |    5.97 kB |                 1.50 kB
7547.js               | pages-user-profile-components-edit-profile-edit-profile-module |    5.86 kB |                 1.96 kB
7702.js               | pages-profile-page-profile-module                              |    5.71 kB |                 1.89 kB
6004.js               | -                                                              |    5.49 kB |                 1.92 kB
6673.js               | -                                                              |    5.05 kB |                 1.25 kB
5290.js               | pages-search-search-module                                     |    4.67 kB |                 1.67 kB
3580.js               | input-shims-8459e7d9-js                                        |    4.57 kB |                 1.78 kB
3544.js               | -                                                              |    4.17 kB |              1007 bytes
2841.js               | -                                                              |    3.76 kB |                 1.27 kB
7465.js               | -                                                              |    3.05 kB |               932 bytes
3079.js               | pages-filter-filter-module                                     |    2.80 kB |                 1.10 kB
6009.js               | pages-success-success-module                                   |    1.88 kB |               902 bytes
5436.js               | index-2061d5f6-js                                              |    1.83 kB |               816 bytes
1745.js               | -                                                              |    1.64 kB |               672 bytes
469.js                | -                                                              |    1.50 kB |               508 bytes
8811.js               | -                                                              | 1008 bytes |               542 bytes
5808.js               | app-pages-project-list-page-projects-module                    |  815 bytes |               437 bytes
3837.js               | status-tap-4d4674a1-js                                         |  529 bytes |               326 bytes

Build at: 2023-10-23T11:23:41.633Z - Hash: 8b2fd0f8c8ea0a89 - Time: 20922ms

Warning: /node_modules/@ionic/storage/dist/esm/index.js depends on 'localforage'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies



** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **


✔ Compiled successfully.

Additional info:

OS: Ubuntu 22.04
node: v16.20.2
npm: 8.19.4
ionic: 7.1.1