ReferenceError: Can't find variable: cordova

Ionic Framework ionic-v3
1

Hey,

I am building my first Ionic 2 app and getting trouble with the emulator (iOS) and the Ionic View app. I didn’t try it with Android.

If I try to start the app I get a white screen of death and the following error message.

image
UwnWn.png997×124 14 KB

Do you need more information about my app / config-files - let me please know.

image
image

This is my package.json-file:

    {
      "dependencies": {
        "@angular/common": "2.0.0-rc.3",
        "@angular/compiler": "2.0.0-rc.3",
        "@angular/core": "2.0.0-rc.3",
        "@angular/http": "2.0.0-rc.3",
        "@angular/platform-browser": "2.0.0-rc.3",
        "@angular/platform-browser-dynamic": "2.0.0-rc.3",
        "@angular/router": "3.0.0-beta.2",
        "es6-shim": "^0.35.0",
        "ionic-angular": "2.0.0-beta.10",
        "ionic-framework": "^2.0.0-beta.2",
        "ionic-native": "1.3.2",
        "ionic-native-transitions": "^1.0.1",
        "ionicons": "3.0.0",
        "reflect-metadata": "^0.1.3",
        "rxjs": "5.0.0-beta.6",
        "zone.js": "^0.6.12"
      },
      "devDependencies": {
        "del": "2.2.0",
        "gulp": "3.9.1",
        "gulp-watch": "4.3.5",
        "ionic-gulp-browserify-typescript": "2.0.0",
        "ionic-gulp-fonts-copy": "^1.0.0",
        "ionic-gulp-html-copy": "^1.0.0",
        "ionic-gulp-sass-build": "^1.0.0",
        "ionic-gulp-scripts-copy": "^2.0.0",
        "ionic-gulp-tslint": "^1.0.0",
        "tslint-ionic-rules": "^0.0.3",
        "run-sequence": "1.1.5"
      },
      "cordovaPlugins": [
        "cordova-plugin-whitelist",
        "cordova-plugin-console",
        "cordova-plugin-statusbar",
        "cordova-plugin-device",
        "cordova-plugin-splashscreen",
        "ionic-plugin-keyboard"
      ],
      "cordovaPlatforms": [
        "ios",
        {
          "platform": "ios",
          "version": "",
          "locator": "ios"
        }
      ],
      "name": "xxx",
      "description": "xxx!"
    }

Thank you very much!

2

Please share some code. We’re unable to help without it.
From the looks of the error, it seems you are trying to use the raw cordova plugin API

Instead, you should use the ionic-native wrappers

3

The problem was the:

<base href="/">

in my index.html

4

@goinnovative Did you have to add or remove that base href from index.html?

5

I had a more or less similar problem … my Ionic app (Ionic 1) running on iOS 8 started to throw “Can’t find variable: cordova” errors all over the place. No idea what could have caused it except for a Cordova upgrade.

(yes I know, always scary and probably “wrong” to just upgrade Cordova or any other essential platform component without extensive testing)

I had no clue how to fix it, until after a lot of Googling I ran across this Github issue:

I then just tried a variant on Bnaya’s suggestion, and that fixed it. Actually I just stuffed this piece of code into my index.html (below the tags that load ngCordova.js and cordova.js):

<script>
  if (!window.cordova) {
    window.cordova = require('cordova');
  }
</script>

And, guess what … my iOS app started working again (didn’t test on Android yet).

Scary … ??

1 Like