Ionic-framework: [Ionic v4.0.0-beta.12] Cordova is not available

[enzonotario]

Bug Report

Ionic Info

Ionic:

   ionic (Ionic CLI)             : 4.2.1 (/usr/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.0-beta.12
   @angular-devkit/build-angular : 0.7.5
   @angular-devkit/schematics    : 0.7.5
   @angular/cli                  : 6.1.5
   @ionic/angular-toolkit        : 1.0.0

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : android 7.0.0
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.2.0, (and 5 other plugins)

System:

   Android SDK Tools : 26.1.1 (/home/enzo/Android/Sdk)
   NodeJS            : v8.11.4 (/usr/bin/node)
   npm               : 5.6.0
   OS                : Linux 4.15

Describe the Bug
Cordova is not loaded on a fresh-installation.

Steps to Reproduce
Steps to reproduce the behavior:

1. Start a project: ionic start ionic4-test --type=angular
2. Add Android as platform
3. Add some @ionic-native plugin (like google-maps)
4. Run ionic cordova run android -l and you will see warnings/errors since cordova is not available, for example:
   Native: tried calling StatusBar.styleDefault, but Cordova is not available. Make sure to include cordova.js or run in a device/simulator
Native: tried calling SplashScreen.hide, but Cordova is not available. Make sure to include cordova.js or run in a device/simulator
Error: Uncaught (in promise): TypeError: Cannot read property 'BaseClass' of null TypeError: Cannot read property 'BaseClass' of null (error with @ionic-native/google-maps)

Related Code
GitHub.

Expected Behavior
Cordova has to be loaded in the app.

Additional Context
In ionic 3 we had a script with cordova.js. Now, in ionic4, I don't see that and don't know how it should be included. But even in an fresh-installation app, it doesn't work.

[ghost]

Had this problem recently, and can confirm it only occurs with live reload enabled.

Solution: downgrade @ionic/ng-toolkit to 1.0.8 as opposed to latest 1.1.0.

Side note: Ionic seems to be switching to a merged package of ng-toolkit & schematics-angular called "angular-toolkit" which also contains the same problem with live reload, thus fresh installs also contain this problem since defaults to new merged package. So for now with fresh installs, uninstall @ionic/angular-toolkit and install @ionic/ng-toolkit & @ionic/schematics-angular (also need to switch angular.json to version that uses the two packages as opposed to the new merged one).

[enzonotario]

@JupiterSymphony thanks! but, with your solution, I don't see any warning/error but it doesn't work either (I have tried @ionic-native/google-maps and @ionic-native/google-plus). I mean, doesn't do anything, and doesn't show error, nothing!

Moreover, if your solution is the way, we have to change angular.json and replace:

@ionic/angular-toolkit:cordova-build -> @ionic/ng-toolkit:cordova-build
@ionic/angular-toolkit:cordova-serve -> @ionic/ng-toolkit:cordova-serve
@ionic/angular-toolkit -> @ionic/schematics-angular
@ionic/angular-toolkit:component -> @ionic/schematics-angular:component
@ionic/angular-toolkit:page -> @ionic/schematics-angular:page

But, as I said, it doesn't sove all...

[ghost]

Interesting, for me downgrading the two separate packages form a preexisting project worked fine, though I'm not completely certain on a fresh install as in your case. Maybe there's more to it than just the two packages and the angular.json file. Either way hopefully they release a fix asap.

[tebantebanteban]

Had this problem recently, and can confirm it only occurs with live reload enabled.

Solution: downgrade @ionic/ng-toolkit to 1.0.8 as opposed to latest 1.1.0.

Side note: Ionic seems to be switching to a merged package of ng-toolkit & schematics-angular called "angular-toolkit" which also contains the same problem with live reload, thus fresh installs also contain this problem since defaults to new merged package. So for now with fresh installs, uninstall @ionic/angular-toolkit and install @ionic/ng-toolkit & @ionic/schematics-angular (also need to switch angular.json to version that uses the two packages as opposed to the new merged one).

works for me!!! thanks!!!

[enzonotario]

@JupiterSymphony @tebantebanteban can you please share your package.json and angular.json? At least the ionic's related parts

[tebantebanteban]

@JupiterSymphony @tebantebanteban can you please share your package.json and angular.json? At least the ionic's related parts

Hi! this is mi package.json

{
  "name": "vesti",
  "version": "0.0.1",
  "author": "Ves5i",
  "homepage": "http://www.vesti.cl/",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^6.1.9",
    "@angular/common": "~6.1.9",
    "@angular/core": "^6.1.9",
    "@angular/forms": "~6.1.9",
    "@angular/http": "~6.1.9",
    "@angular/platform-browser": "~6.1.9",
    "@angular/platform-browser-dynamic": "~6.1.9",
    "@angular/router": "~6.1.9",
    "@ionic-native/barcode-scanner": "^5.0.0-beta.21",
    "@ionic-native/core": "5.0.0-beta.21",
    "@ionic-native/facebook": "^5.0.0-beta.21",
    "@ionic-native/onesignal": "^5.0.0-beta.21",
    "@ionic-native/splash-screen": "5.0.0-beta.21",
    "@ionic-native/status-bar": "5.0.0-beta.21",
    "@ionic/angular": "4.0.0-beta.12",
    "@ionic/angular-toolkit": "^1.0.0",
    "@ionic/app-scripts": "^3.2.0",
    "@swimlane/ngx-datatable": "^13.1.0",
    "angular-archwizard": "^3.0.0",
    "angular-particle": "^1.0.4",
    "angularx-qrcode": "^1.2.4",
    "cordova": "^8.1.2",
    "cordova-ios": "4.5.5",
    "cordova-lib": "^8.1.1",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-facebook4": "^3.0.0",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^2.2.0",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "core-js": "^2.5.7",
    "ionic": "^4.2.1",
    "ng2-completer": "^2.0.8",
    "ng2-rut": "^0.2.3",
    "ng2-simple-global": "^1.2.5",
    "ngx-chips": "^1.9.8",
    "ngx-countdown": "^3.1.0",
    "ngx-loading": "^3.0.1",
    "ngx-order-pipe": "^2.0.1",
    "ngx-slick-carousel": "^0.4.2",
    "onesignal-cordova-plugin": "^2.4.4",
    "phonegap-plugin-barcodescanner": "^8.0.0",
    "rxjs": "6.3.3",
    "rxjs-compat": "^6.3.3",
    "ts-md5": "^1.2.4",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/architect": "~0.9.0-rc.1",
    "@angular-devkit/build-angular": "~0.9.0-rc.1",
    "@angular-devkit/core": "~7.0.0-rc.1",
    "@angular-devkit/schematics": "~7.0.0-rc.1",
    "@angular/cli": "^6.2.4",
    "@angular/compiler": "~6.1.9",
    "@angular/compiler-cli": "~6.1.9",
    "@angular/language-service": "~6.1.9",
    "@ionic/lab": "^1.0.11",
    "@ionic/ng-toolkit": "^1.0.8",
    "@ionic/schematics-angular": "^1.0.7",
    "@types/jasmine": "~2.8.9",
    "@types/jasminewd2": "~2.0.5",
    "@types/node": "~10.11.5",
    "codelyzer": "~4.5.0",
    "jasmine-core": "~3.2.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.4",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^1.3.1",
    "protractor": "~5.4.1",
    "ts-node": "~7.0.1",
    "tslint": "~5.11.0",
    "typescript": "^2.9.2"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-whitelist": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {},
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-facebook4": {
        "APP_ID": "XXXXX",
        "APP_NAME": "“XXXX”",
        "FACEBOOK_ANDROID_SDK_VERSION": "4.36.0"
      },
      "onesignal-cordova-plugin": {},
      "phonegap-plugin-barcodescanner": {}
    },
    "platforms": [
      "ios"
    ]
  }
}

Angular.json:

{
  "$schema": "./node_modules/@angular-devkit/core/src/workspace/workspace-schema.json",
  "version": 1,
  "defaultProject": "app",
  "newProjectRoot": "projects",
  "projects": {
    "app": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",
      "schematics": {},
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "progress": false,
            "outputPath": "www",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": [
              {
                "glob": "**/*",
                "input": "src/assets",
                "output": "assets"
              },
              {
                "glob": "**/*.svg",
                "input": "node_modules/@ionic/angular/dist/ionic/svg",
                "output": "./svg"
              }
            ],
            "styles": [
              {
                "input": "src/theme/variables.scss"
              },
              {
                "input": "src/global.scss"
              }
            ],
            "scripts": []
          },
          "configurations": {
            "production": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true
            }
          }
        },
        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "app:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "app:build:production"
            }
          }
        },
        "extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n",
          "options": {
            "browserTarget": "app:build"
          }
        },
        "test": {
          "builder": "@angular-devkit/build-angular:karma",
          "options": {
            "main": "src/test.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.spec.json",
            "karmaConfig": "src/karma.conf.js",
            "styles": [
              "styles.css"
            ],
            "scripts": [],
            "assets": [
              {
                "glob": "favicon.ico",
                "input": "src/",
                "output": "/"
              },
              {
                "glob": "**/*",
                "input": "src/assets",
                "output": "/assets"
              }
            ]
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": [
              "src/tsconfig.app.json",
              "src/tsconfig.spec.json"
            ],
            "exclude": [
              "**/node_modules/**"
            ]
          }
        },
        "ionic-cordova-build": {
          "builder": "@ionic/ng-toolkit:cordova-build",
          "options": {
            "browserTarget": "app:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "app:build:production"
            }
          }
        },
        "ionic-cordova-serve": {
          "builder": "@ionic/ng-toolkit:cordova-serve",
          "options": {
            "cordovaBuildTarget": "app:ionic-cordova-build",
            "devServerTarget": "app:serve"
          },
          "configurations": {
            "production": {
              "cordovaBuildTarget": "app:ionic-cordova-build:production",
              "devServerTarget": "app:serve:production"
            }
          }
        }
      }
    },
    "app-e2e": {
      "root": "e2e/",
      "projectType": "application",
      "architect": {
        "e2e": {
          "builder": "@angular-devkit/build-angular:protractor",
          "options": {
            "protractorConfig": "e2e/protractor.conf.js",
            "devServerTarget": "app:serve"
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": "e2e/tsconfig.e2e.json",
            "exclude": [
              "**/node_modules/**"
            ]
          }
        }
      }
    }
  },
  "cli": {
    "defaultCollection": "@ionic/schematics-angular"
  },
  "schematics": {
    "@ionic/schematics-angular:component": {
      "styleext": "scss"
    },
    "@ionic/schematics-angular:page": {
      "styleext": "scss"
    }
  }
}

[enzonotario]

Hi @tebantebanteban . Sorry but that is the output of ionic info command. I mean the content of the package.json. I'd like to see what dependencies you have.

[alan-albuquerque]

I also have this problem = ( ...

My infos: https://github.com/ionic-team/ionic/issues/15860

[tebantebanteban]

Hi @tebantebanteban . Sorry but that is the output of ionic info command. I mean the content of the package.json. I'd like to see what dependencies you have.

Sorry, I've update the answer with package.json

[nagro]

I have the same problem, how to fix this?

[tebantebanteban]

I have the same problem, how to fix this?

Hi!, finally solved downgrading @ionic/ng-toolkit to 1.0.8

thanks for @JupiterSymphony

Regards!

[shaxxx]

I can confirm @JupiterSymphony workaround is working with fresh project.

• Remove @ionic/angular-toolkit
• Install @ionic/[email protected]
• Check npm install for dependencies that need resolving
• Update ionic-cordova-build and ionic-cordova-serve commands in angular.json to reference @ionic/ng-toolkit
• Run ionic cordova run --debug -l

ionic serve -c still doesn't have Cordova working on device

[shaxxx]

Fixed in beta16

[brandyscarney]

Thanks for the issue! Closing as fixed in latest, 4.0.0-beta.16. Please let me know if anyone is still seeing this though, thanks!

[nkprince007]

I'm still seeing the issue.

❯ ionic info

Ionic:

   ionic (Ionic CLI)             : 4.5.0 (/Users/nkprince007/.nvm/versions/node/v10.11.0/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.0-beta.17
   @angular-devkit/build-angular : 0.8.8
   @angular-devkit/schematics    : 0.7.5
   @angular/cli                  : 6.1.4
   @ionic/angular-toolkit        : 1.2.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 ([email protected])
   Cordova Platforms     : ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.3.0, (and 3 other plugins)

System:

   ios-deploy : 1.9.4
   NodeJS     : v10.11.0 (/Users/nkprince007/.nvm/versions/node/v10.11.0/bin/node)
   npm        : 6.4.1
   OS         : macOS Mojave
   Xcode      : Xcode 10.1 Build version 10B61

package.json

{
  "name": "ionic-react",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/core": "~6.1.1",
    "@ionic-native/core": "5.0.0-beta.14",
    "@ionic-native/splash-screen": "5.0.0-beta.14",
    "@ionic-native/status-bar": "5.0.0-beta.14",
    "@ionic/angular": "^4.0.0-beta.17",
    "@ionic/angular-toolkit": "^1.2.0",
    "@ionic/core": "^4.0.0-beta.17",
    "angular-cli-builders": "^2.1.2",
    "angular-ionic-cli-builders": "^2.1.4",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-preset-react": "^6.24.1",
    "cordova": "^8.1.2",
    "cordova-ios": "4.5.5",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^2.3.0",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "core-js": "^2.5.3",
    "react": "^16.4.2",
    "react-dom": "^16.4.2",
    "rxjs": "6.2.2",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/architect": "~0.8.0-rc.1",
    "@angular-devkit/build-angular": "~0.8.0-rc.1",
    "@angular-devkit/core": "^7.1.1",
    "@angular-devkit/schematics": "~0.7.2",
    "@angular/cli": "~6.1.1",
    "@angular/compiler": "~6.1.1",
    "@angular/compiler-cli": "~6.1.1",
    "@angular/language-service": "~6.1.1",
    "@ionic/ng-toolkit": "1.0.8",
    "@ionic/schematics-angular": "^1.0.0",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~10.7.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~2.7.2"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-whitelist": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {},
      "cordova-plugin-ionic-keyboard": {}
    },
    "platforms": [
      "ios"
    ]
  }
}

[nkprince007]

@brandyscarney I'm trying to use react with ionic 4 and so I modified my angular.json configuration a bit to allow extending custom webpack configuration. Here's the modified file.

{
  "$schema": "./node_modules/@angular-devkit/core/src/workspace/workspace-schema.json",
  "version": 1,
  "defaultProject": "app",
  "newProjectRoot": "projects",
  "projects": {
    "app": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",
      "schematics": {},
      "architect": {
        "build": {
          "builder": "angular-cli-builders:custom-webpack-browser",
          "options": {
            "customWebpackConfig": {
              "path": "./extra-webpack.config.js"
            },
            "outputPath": "www",
            "index": "src/index.html",
            "main": "src/main.jsx",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": [
              {
                "glob": "**/*",
                "input": "src/assets",
                "output": "assets"
              }
            ],
            "styles": [
              {
                "input": "src/theme/variables.scss"
              },
              {
                "input": "src/global.scss"
              }
            ],
            "scripts": []
          },
          "configurations": {
            "production": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "budgets": [
                {
                  "type": "initial",
                  "maximumWarning": "2mb",
                  "maximumError": "5mb"
                }
              ]
            },
            "ci": {
              "progress": false
            }
          }
        },
        "serve": {
          "builder": "angular-cli-builders:generic-dev-server",
          "options": {
            "browserTarget": "app:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "app:build:production"
            },
            "ci": {
              "progress": false
            }
          }
        },
        "extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n",
          "options": {
            "browserTarget": "app:build"
          }
        },
        "test": {
          "builder": "@angular-devkit/build-angular:karma",
          "options": {
            "main": "src/test.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.spec.json",
            "karmaConfig": "src/karma.conf.js",
            "styles": [],
            "scripts": [],
            "assets": [
              {
                "glob": "favicon.ico",
                "input": "src/",
                "output": "/"
              },
              {
                "glob": "**/*",
                "input": "src/assets",
                "output": "/assets"
              }
            ]
          },
          "configurations": {
            "ci": {
              "progress": false,
              "watch": false
            }
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": ["src/tsconfig.app.json", "src/tsconfig.spec.json"],
            "exclude": ["**/node_modules/**"]
          }
        },
        "ionic-cordova-build": {
          "builder": "angular-ionic-cli-builders:generic-dev-server",
          "options": {
            "browserTarget": "app:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "app:build:production"
            }
          }
        },
        "ionic-cordova-serve": {
          "builder": "angular-ionic-cli-builders:generic-dev-server",
          "options": {
            "cordovaBuildTarget": "app:ionic-cordova-build",
            "devServerTarget": "app:serve",
            "browserTarget": "app:build"
          },
          "configurations": {
            "production": {
              "cordovaBuildTarget": "app:ionic-cordova-build:production",
              "devServerTarget": "app:serve:production"
            }
          }
        }
      }
    },
    "app-e2e": {
      "root": "e2e/",
      "projectType": "application",
      "architect": {
        "e2e": {
          "builder": "@angular-devkit/build-angular:protractor",
          "options": {
            "protractorConfig": "e2e/protractor.conf.js",
            "devServerTarget": "app:serve"
          },
          "configurations": {
            "ci": {
              "devServerTarget": "app:serve:ci"
            }
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": "e2e/tsconfig.e2e.json",
            "exclude": ["**/node_modules/**"]
          }
        }
      }
    }
  },
  "cli": {
    "defaultCollection": "@ionic/angular-toolkit"
  },
  "schematics": {
    "@ionic/angular-toolkit:component": {
      "styleext": "scss"
    },
    "@ionic/angular-toolkit:page": {
      "styleext": "scss"
    }
  }
}

I've noticed that using the custom builder angular-ionic-cli-builders:generic-dev-server is skipping injection of cordova.js file that is required.

Could you please help me resolve this issue? I need to be able to inject custom build configuration (babel-loader and babel-preset-react for jsx transpilation) and also need injection of cordova.js during webpack serve. I can continue to use the third party package, but I don't understand how cordova.js is injected by @ionic/angular-toolkit:cordova-serve. Please let me know about how to tackle this problem.

[paulstelzer]

UPDATE: You shouldn't use livereload because this can to be a problem

For me it looks like an issue in your cordova creating process. I am creating several apps with Ionic and Cordova and do not have this issue.

1. Start a project: ionic start ionic4-test --type=angular
2. Add Android platform: ionic cordova platform add android
3. Run the android: ionic cordova run android

Keep in mind that in angular.json the correct builder have to be added from ionic

        "ionic-cordova-build": {
          "builder": "@ionic/angular-toolkit:cordova-build",
          "options": {
            "browserTarget": "app:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "app:build:production"
            }
          }
        },
        "ionic-cordova-serve": {
          "builder": "@ionic/angular-toolkit:cordova-serve",
          "options": {
            "cordovaBuildTarget": "app:ionic-cordova-build",
            "devServerTarget": "app:serve"
          },
          "configurations": {
            "production": {
              "cordovaBuildTarget": "app:ionic-cordova-build:production",
              "devServerTarget": "app:serve:production"
            }
          }
        }

[nkprince007]

@paulstelzer, as I mentioned before, I need to inject additional build configuration for webpack to be able to parse JSX which is not directly extensible from @ionic/angular-toolkit:cordova-serve. This probably is not a bug but more of a feature request to make ionic angular builders extensible.

If there's any other documented way to start an ionic 4 cordova app with react, please let me know about it.

[paulstelzer]

Thanks for your response! Could you open a feature request for it? That would be great :)

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.