Blank White Screen After Ionic V3 --prod --release Build

We just started getting a blank white screen after doing npm run ionic:build --prod --release, previously had no problems doing --prod --release builds.

There are no errors in the console, the only warning in the server logs is "GET /build/sw-toolbox.js.map" Error (404): "Not found" but not sure it’s that’s an issue or not.

Older posts on the forums didn’t seem to resolve the issue, we’re currently using latest @ionic/app-scripts version 3.2.4.

Strangely, doing npm run ionic:build works fine. Could the issue be related to enableProdMode on Angular?

Here is our package.json file:

{
  "name": "app-name",
  "version": "2.11.0",
  "author": "our company",
  "homepage": "https://www.ourwebsite.org",
  "private": true,
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "watch": "ionic-app-scripts watch",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve",
    "ionic:watch": "ionic-app-scripts watch",
    "test": "karma start ./config/karma.conf.js",
    "test-ci": "karma start ./config/karma.conf.js --single-run",
    "test-coverage": "karma start ./config/karma.conf.js --coverage",
    "e2e": "npm run e2e-update && npm run e2e-test",
    "e2e-test": "protractor ./config/protractor.conf.js",
    "e2e-update": "webdriver-manager update --standalone false --gecko false"
  },
  "config": {
    "ionic_copy": "./config/copy.config.js",
    "ionic_webpack": "./config/webpack.config.js",
    "ionic_source_map_type": "source-map",
    "ionic_generate_source_map": true,
    "ionic_move_source_maps": true
  },
  "dependencies": {
    "@angular/animations": "5.2.11",
    "@angular/common": "5.2.11",
    "@angular/compiler": "5.2.11",
    "@angular/compiler-cli": "5.2.11",
    "@angular/core": "5.2.11",
    "@angular/forms": "5.2.11",
    "@angular/http": "5.2.11",
    "@angular/platform-browser": "5.2.11",
    "@angular/platform-browser-dynamic": "5.2.11",
    "@ionic-native/app-availability": "~4.15.0",
    "@ionic-native/app-version": "~4.15.0",
    "@ionic-native/badge": "~4.15.0",
    "@ionic-native/camera": "~4.15.0",
    "@ionic-native/contacts": "~4.15.0",
    "@ionic-native/core": "~4.15.0",
    "@ionic-native/deeplinks": "~4.15.0",
    "@ionic-native/device": "~4.15.0",
    "@ionic-native/diagnostic": "~4.15.0",
    "@ionic-native/fcm": "~4.15.0",
    "@ionic-native/file": "~4.15.0",
    "@ionic-native/file-transfer": "~4.15.0",
    "@ionic-native/firebase": "~4.15.0",
    "@ionic-native/geolocation": "~4.15.0",
    "@ionic-native/http": "~4.15.0",
    "@ionic-native/in-app-browser": "~4.15.0",
    "@ionic-native/intercom": "~4.15.0",
    "@ionic-native/is-debug": "~4.15.0",
    "@ionic-native/keyboard": "~4.15.0",
    "@ionic-native/native-geocoder": "~4.15.0",
    "@ionic-native/native-storage": "~4.15.0",
    "@ionic-native/network": "~4.15.0",
    "@ionic-native/screen-orientation": "~4.15.0",
    "@ionic-native/sim": "~4.15.0",
    "@ionic-native/social-sharing": "~4.15.0",
    "@ionic-native/splash-screen": "~4.15.0",
    "@ionic-native/sqlite": "~4.15.0",
    "@ionic-native/status-bar": "~4.15.0",
    "@ionic-native/themeable-browser": "~4.15.0",
    "@ionic/storage": "2.2.0",
    "cordova-android-support-gradle-release": "^1.4.7",
    "cordova-browser": "5.0.4",
    "cordova-custom-config": "^5.1.0",
    "cordova-plugin-add-swift-support": "^1.7.1",
    "cordova-plugin-advanced-http": "^1.11.1",
    "cordova-plugin-app-version": "^0.1.9",
    "cordova-plugin-appavailability": "^0.4.2",
    "cordova-plugin-badge": "^0.8.8",
    "cordova-plugin-camera": "^2.4.1",
    "cordova-plugin-compat": "^1.2.0",
    "cordova-plugin-contacts": "^2.3.1",
    "cordova-plugin-device": "^1.1.7",
    "cordova-plugin-file": "^6.0.1",
    "cordova-plugin-file-transfer": "^1.7.1",
    "cordova-plugin-firebase": "^2.0.5",
    "cordova-plugin-firebase-analytics": "^1.0.0",
    "cordova-plugin-geolocation": "^2.4.3",
    "cordova-plugin-intercom": "^6.2.0",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^4.0.1",
    "cordova-plugin-is-debug": "^1.0.0",
    "cordova-plugin-nativegeocoder": "^2.0.5",
    "cordova-plugin-nativestorage": "^2.3.2",
    "cordova-plugin-network-information": "^1.3.4",
    "cordova-plugin-screen-orientation": "^2.0.2",
    "cordova-plugin-sim": "^1.3.3",
    "cordova-plugin-splashscreen": "^4.1.0",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-themeablebrowser": "^0.2.18",
    "cordova-plugin-whitelist": "^1.3.3",
    "cordova-plugin-x-socialsharing": "^5.4.4",
    "cordova-sqlite-storage": "^2.6.0",
    "cordova-universal-links-plugin": "^1.2.1",
    "cordova.plugins.diagnostic": "^3.9.2",
    "es6-promise-plugin": "^4.2.2",
    "firebase": "4.9.1",
    "ionic-angular": "3.9.2",
    "ionic-plugin-deeplinks": "^1.0.20",
    "ionicons": "3.0.0",
    "ios-sim": "^9.0.0-dev.4",
    "moment": "^2.18.1",
    "ng-intercom": "0.2.2",
    "ngx-localstorage": "2.0.1",
    "ngx-segment-analytics": "^1.0.4",
    "raven-js": "^3.27.1",
    "rxjs": "5.5.11",
    "sw-toolbox": "^3.6.0",
    "zone.js": "0.8.26"
  },
  "devDependencies": {
    "@ionic/app-scripts": "^3.2.4",
    "@types/es6-promise": "^3.3.0",
    "@types/jasmine": "=2.8.9",
    "@types/node": "^8.0.45",
    "angular2-template-loader": "^0.6.2",
    "codelyzer": "^4.5.0",
    "html-loader": "^0.5.1",
    "ionic-version": "^1.0.3",
    "istanbul-instrumenter-loader": "^3.0.0",
    "jasmine": "^2.5.3",
    "jasmine-spec-reporter": "^4.1.0",
    "karma": "^4.0.1",
    "karma-chrome-launcher": "^2.0.0",
    "karma-coverage-istanbul-reporter": "^1.3.0",
    "karma-jasmine": "^1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-webpack": "^2.0.3",
    "null-loader": "^0.1.1",
    "protractor": "^5.4.0",
    "tar": ">=4.4.2",
    "ts-loader": "^3.0.3",
    "ts-node": "^3.0.2",
    "typescript": "^3.0"
  },
  "cordovaPlugins": [
    "cordova-plugin-whitelist",
    "cordova-plugin-statusbar",
    "cordova-plugin-device",
    "cordova-plugin-splashscreen"
  ],
  "cordovaPlatforms": [
    "ios",
    {
      "platform": "ios",
      "version": "",
      "locator": "ios"
    }
  ],
  "description": "TenFour App",
  "cordova": {
    "plugins": {
      "cordova-plugin-app-version": {},
      "cordova-plugin-appavailability": {},
      "cordova-plugin-camera": {
        "CAMERA_USAGE_DESCRIPTION": "This app would like to access your camera.",
        "PHOTOLIBRARY_USAGE_DESCRIPTION": "This app would like to access your photo library."
      },
      "cordova-plugin-contacts": {
        "CONTACTS_USAGE_DESCRIPTION": "This app would like to access your contacts."
      },
      "cordova-plugin-device": {},
      "cordova-plugin-file": {},
      "cordova-plugin-file-transfer": {},
      "cordova-plugin-geolocation": {
        "GEOLOCATION_USAGE_DESCRIPTION": "This app would like to access your location."
      },
      "cordova-plugin-is-debug": {},
      "cordova-plugin-network-information": {},
      "cordova-plugin-sim": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-whitelist": {},
      "cordova-plugin-x-socialsharing": {},
      "cordova-sqlite-storage": {},
      "cordova.plugins.diagnostic": {},
      "ionic-plugin-deeplinks": {
        "URL_SCHEME": "tenfour",
        "DEEPLINK_SCHEME": "https",
        "DEEPLINK_HOST": "app.ourwebsite.org",
        "ANDROID_PATH_PREFIX": "/"
      },
      "cordova-custom-config": {},
      "cordova-plugin-themeablebrowser": {},
      "cordova-plugin-ionic-webview": {},
      "cordova-plugin-nativegeocoder": {
        "LOCATION_WHEN_IN_USE_DESCRIPTION": "This app would like to use a geocoder service."
      },
      "cordova-plugin-screen-orientation": {},
      "cordova-plugin-badge": {},
      "cordova-plugin-advanced-http": {},
      "cordova-plugin-firebase": {},
      "cordova-android-support-gradle-release": {
        "ANDROID_SUPPORT_VERSION": "26.+"
      },
      "cordova-plugin-intercom": {},
      "cordova-plugin-nativestorage": {},
      "cordova-plugin-ionic-keyboard": {}
    },
    "platforms": [
      "browser"
    ]
  }
}

Alright, I tracked down the problem, looks like raven-js started causing problems when doing --prod --release builds, so we upgraded to using @sentry/browser instead and it resolved the problem.

1 Like