PC Crashed, now to reinstall Cordova Plugins


#1

I am using Ionic2.

My PC crashed and I had to reinstall my my app again, luckily I had all the source code backed up.

The source code was working perfectly before the crash on an Android device.

ionic build android

My problem now when I build the and install the apk, some of the plugins do not work on the device. These errors must be related to the dependencies because previously this worked.

Any ideas how to fix the errors would be appreciated.

1) SQLite Error

Unable to open database 
ReferenceError
message: "sqlitePlugin is not defined"
stack: (...)
get stack: function () { [native code] }
set stack: function () { [native code] }
__proto__: Error

app.ts

import { StatusBar, Push, SQLite } from 'ionic-native';

  private createDatabase(): void {
    let db: SQLite = new SQLite();
    db.openDatabase({
      name: "data.db",
      location: "default"
    }).then(() => {
      db.executeSql("CREATE TABLE IF NOT EXISTS chats (_id TEXT PRIMARY KEY, memberIds TEXT, title TEXT, subTitle TEXT, picture TEXT, lastMessageId TEXT, lastMessageCreatedAt DATE)", {}).then((chatData) => {
        db.executeSql("CREATE TABLE IF NOT EXISTS messages (_id TEXT PRIMARY KEY, chatId TEXT, senderId TEXT, ownership TEXT, content TEXT, createdAt DATE, changeDate BOOLEAN, readByReceiver BOOLEAN)", {}).then((messageData) => {
        }, (error) => {
          console.error("Unable to execute messages sql", error);
        });

      }, (error) => {
        console.error("Unable to execute chats sql", error);
      });
    }, (error) => {
      console.error("Unable to open database", error);
    });
  }

2) Geolocation Error

PositionError {message: "Timeout expired", code: 3, PERMISSION_DENIED: 1, POSITION_UNAVAILABLE: 2, TIMEOUT: 3}

ts file

import { Geolocation } from 'ionic-native';

    public getPosition(): void {
        if (this.markers && this.markers.length > 0) {
            var marker: google.maps.Marker = this.markers[0]; // only one
            this.latitude = marker.getPosition().lat();
            this.longitude = marker.getPosition().lng();
            this.getJobRangeSearch(this.searchQuery);
        } else {
            let options = {
                timeout: 10000,
                enableHighAccuracy: true
            };
            Geolocation.getCurrentPosition(options).then((position) => {
                this.latitude = position.coords.latitude;
                this.longitude = position.coords.longitude;
                this.getJobRangeSearch(this.searchQuery);
            }).catch((error) => {
                console.log(error);
                this.doAlert(error+' Timeout trying to get your devices Location');
            });
        }
    }

I get the Timeout trying to get your devices Location error alerted.

package.json

{
  "dependencies": {
    "@angular/common": "^2.0.0-rc.4",
    "@angular/compiler": "^2.0.0-rc.4",
    "@angular/core": "^2.0.0-rc.4",
    "@angular/forms": "^0.2.0",
    "@angular/http": "^2.0.0-rc.4",
    "@angular/platform-browser": "^2.0.0-rc.4",
    "@angular/platform-browser-dynamic": "^2.0.0-rc.4",
    "accounts-base-client-side": "^0.1.1",
    "accounts-phone": "0.0.1",
    "angular2-meteor": "^0.6.2",
    "angular2-meteor-polyfills": "^0.1.1",
    "angular2-moment": "^0.8.2",
    "es6-shim": "^0.35.0",
    "ionic-angular": "^2.0.0-beta.11",
    "ionic-native": "^1.3.2",
    "ionicons": "3.0.0",
    "meteor-client-side": "^1.3.4",
    "moment": "^2.14.1",
    "reflect-metadata": "^0.1.3",
    "rxjs": "5.0.0-beta.6",
    "socket.io": "^1.4.8",
    "zone.js": "^0.6.12"
  },
  "devDependencies": {
    "del": "2.2.0",
    "gulp": "3.9.1",
    "gulp-watch": "4.3.5",
    "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",
    "ionic-gulp-webpack": "^2.0.0",
    "lodash.camelcase": "^4.3.0",
    "lodash.upperfirst": "^4.3.1",
    "run-sequence": "1.1.5",
    "ts-loader": "^0.8.2",
    "tslint-ionic-rules": "^0.0.3",
    "webpack": "^1.13.2"
  },
  "name": "theWhoZoo",
  "description": "theWhoZoo: An Ionic project",
  "cordovaPlugins": [
    "cordova-plugin-device",
    "cordova-plugin-console",
    "cordova-plugin-whitelist",
    "cordova-plugin-splashscreen",
    "cordova-plugin-statusbar",
    "ionic-plugin-keyboard",
    {
      "variables": {
        "SENDER_ID": "XXXXXXXXXXX"
      },
      "locator": "phonegap-plugin-push",
      "id": "phonegap-plugin-push"
    }
  ],
  "cordovaPlatforms": []
}

UPDATE

If I do:

npm install ionic-angular

I get:

+-- ionic-angular@2.0.0-rc.0
| +-- UNMET PEER DEPENDENCY @angular/compiler@2.0.2
| +-- UNMET PEER DEPENDENCY @angular/platform-browser@2.0.2
| +-- UNMET PEER DEPENDENCY rxjs@5.0.0-rc.1
| `-- UNMET PEER DEPENDENCY zone.js@0.6.25
+-- UNMET PEER DEPENDENCY rxjs@5.0.0-beta.6
`-- UNMET PEER DEPENDENCY zone.js@0.6.12

How do I install rxjs and zone.js?

If I do:

npm install zone.js

I get:

+-- UNMET PEER DEPENDENCY rxjs@5.0.0-beta.6
`-- zone.js@0.6.25

When I try install the dependency, it says the same dependency is missing. How does this make sense?

npm install rxjs@5.0.0-beta.12 --save
`-- UNMET PEER DEPENDENCY rxjs@5.0.0-beta.12