title: Ionic 2 Runtime Error: Cordova is undefined
body: <p>When I tried to run my Ionic v3.14.0 hybrid app in browser, I got the runtime error "Cordova is undefined". I followed <a href="https://stackoverflow.com/questions/32383076/phonertc-ionic-demo-cordova-is-undefined">this</a> post's answer and ran the below commands</p>
  
  <pre><code>ionic cordova platform add browser
  ionic cordova run browser
  </code></pre>
  
  <p>The first command above added <code>Platforms/browser</code> to my project and a folder structure beneath it and I can find <code>cordova.js</code> under <code>Platforms/browser/www</code>.
  However when I run the 2nd comman above, a blank chrome browser instance opens (though my default is IE) and remains blank without showing up the app. Below is the stack trace from the terminal.</p>
  
  <pre><code>PS C:\Data\Per\Biz\Ionic\MyApp&gt; ionic cordova run browser
  Running app-scripts build: --platform browser --target cordova
  [00:47:27]  build dev started ...
  [00:47:27]  clean started ...
  [00:47:27]  clean finished in 12 ms
  [00:47:27]  copy started ...
  [00:47:27]  deeplinks started ...
  [00:47:28]  deeplinks finished in 113 ms
  [00:47:28]  transpile started ...
  [00:47:31]  transpile finished in 3.71 s
  [00:47:31]  preprocess started ...
  [00:47:31]  preprocess finished in 1 ms
  [00:47:31]  webpack started ...
  [00:47:32]  copy finished in 4.39 s
  [00:47:41]  webpack finished in 9.49 s
  [00:47:41]  sass started ...
  [00:47:42]  sass finished in 1.40 s
  [00:47:42]  postprocess started ...
  [00:47:42]  postprocess finished in 16 ms
  [00:47:42]  lint started ...
  [00:47:42]  build dev finished in 15.21 s
  &gt; cordova run browser
  Error loading cordova-browser
  
  Running command: cmd "/s /c "C:\Data\Per\Biz\Ionic\MyApp\platforms\browser\cordova\build.bat""
  
  Cleaning Browser project
  [00:47:46]  lint finished in 4.18 s
  Running command: cmd "/s /c "C:\Data\Per\Biz\Ionic\MyApp\platforms\browser\cordova\run.bat --nobuild""
  Static file server running @ http://localhost:8000/index.html
  CTRL + C to shut down
  200 /index.html (gzip)
  200 /cordova.js (gzip)
  200 /build/main.js (gzip)
  200 /build/polyfills.js (gzip)
  200 /build/main.css (gzip)
  200 /cordova_plugins.js (gzip)
  200 /plugins/cordova-plugin-device/www/device.js (gzip)
  200 /plugins/cordova-plugin-device/src/browser/DeviceProxy.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.plugin.oauth.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.plugin.network.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.plugin.sdkinfo.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.plugin.smartstore.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.plugin.smartstore.client.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.plugin.sfaccountmanager.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.plugin.smartsync.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.util.bootstrap.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.util.event.js (gzip)
  200 /plugins/ionic-plugin-keyboard/www/browser/keyboard.js
  200 /plugins/com.salesforce/www/com.salesforce.util.exec.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.util.logger.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.util.promiser.js (gzip)
  200 /plugins/com.salesforce/www/com.salesforce.util.push.js (gzip)
  200 /plugins/cordova-plugin-splashscreen/www/splashscreen.js (gzip)
  200 /plugins/cordova-plugin-splashscreen/src/browser/SplashScreenProxy.js (gzip)
  200 /config.xml (gzip)
  404 /screen
  200 /build/vendor.js (gzip)
  200 /assets/icon/favicon.ico (gzip)
  </code></pre>
  
  <p>I have included <code>&lt;script src="cordova.js"&gt;&lt;/script&gt;</code> in index.html</p>
  
  <p>Below are my ts files where I declared Cordova:
  <strong>data-service.ts</strong></p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { Http, Response } from '@angular/http';
  import 'rxjs/add/operator/map';
  
  declare let cordova:any;
  
  /*
    Generated class for the DataServiceProvider provider.
  
    See https://angular.io/guide/dependency-injection for more info on providers
    and Angular DI.
  */
  @Injectable()
  export class DataServiceProvider {
    indexSpecs:any[];
    soupName = "menuItems"; 
  
    constructor(public http: Http) {
      console.log('Hello DataServiceProvider Provider');
    }
  
    getMainMenu(){
      return this.http.get('assets/data/mainmenu.json')
      .map((response:Response)=&gt;response.json().Categories);
    }
  
    getMainMenuItems() {
      this.registerSmartStoreSoup();
    }
  
    registerSmartStoreSoup() {
      this.indexSpecs = [{path:"Name",type:"string"},{path:"Id",type:"string"}];
      cordova.require("com.salesforce.plugin.smartstore").registerSoup(this.soupName,this.indexSpecs,this.successCallback,this.errorCallback);
    }
  
    successCallback() {
      console.log("Soup "+this.soupName+" Created Successfully");
    }
  
    errorCallback(err) {
      console.log("Error Creating "+this.soupName+":"+err)
    }
  
  }
  </code></pre>
  
  <p>getMainMenuItems() from above is called in the constructor of <strong>app.component.ts</strong></p>
  
  <pre><code>constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen, public dataService: DataServiceProvider) {
      this.initializeApp();
  
      this.dataService.getMainMenuItems();
  </code></pre>
  
  <p>I am suspicious of the output <code>"Error loading cordova-browser"</code> in the stack trace above. But not sure of the issue here. Can someone please help me, I am struck here for a while.</p>