I followed this tutorial https://ionicframework.com/docs/native/sqlite but after clicking a button when I call a function to create a table then I am getting below error, please help me to solve this issue:
Runtime Error
Uncaught (in promise): TypeError: Cannot read property ‘split’ of undefined TypeError: Cannot read property ‘split’ of undefined at get (http://192.168.43.113:8100/build/vendor.js:57299:22) at getPlugin (http://192.168.43.113:8100/build/vendor.js:57331:12) at checkAvailability (http://192.168.43.113:8100/build/vendor.js:67875:86) at http://192.168.43.113:8100/build/vendor.js:91789:102 at SQLite.create (http://192.168.43.113:8100/build/vendor.js:91794:11) at http://192.168.43.113:8100/build/5.js:164:42 at t.invoke (http://192.168.43.113:8100/build/polyfills.js:3:14976) at Object.onInvoke (http://192.168.43.113:8100/build/vendor.js:5445:33) at t.invoke (http://192.168.43.113:8100/build/polyfills.js:3:14916) at r.run (http://192.168.43.113:8100/build/polyfills.js:3:10143)
Stack
Error: Uncaught (in promise): TypeError: Cannot read property ‘split’ of undefined
TypeError: Cannot read property ‘split’ of undefined
at get (http://192.168.43.113:8100/build/vendor.js:57299:22)
at getPlugin (http://192.168.43.113:8100/build/vendor.js:57331:12)
controller ts file
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, Platform } from 'ionic-angular';
import { SQLite, SQLiteObject } from '@ionic-native/sqlite/ngx';
@IonicPage()
@Component({
selector: 'page-stats',
templateUrl: 'stats.html'
})
export class StatsPage {
currentItems: any = [];
data = { date: '', type: '', description: '', amount: 0 };
constructor(
private platform: Platform,
public navCtrl: NavController,
private sqlite: SQLite,
public navParams: NavParams
) {}
addData() {
alert('called');
return new Promise((resolve, reject) => {
this.platform.ready().then(val => {
alert('called2'); // upto this i am getting alert but after this it throws error
this.sqlite.create({
name: 'data.db',
location: 'default'
})
.then((db: SQLiteObject) => {
db.executeSql('create table danceMoves(name VARCHAR(32))', [])
.then(() => console.log('Executed SQL'))
.catch(e => console.log(e));
})
.catch(e => console.log(e));
});
});
}
}
app.module.ts
import { HttpClient, HttpClientModule } from '@angular/common/http';
import { ErrorHandler, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { Camera } from '@ionic-native/camera';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import { SQLite } from '@ionic-native/sqlite/ngx';
import { IonicStorageModule, Storage } from '@ionic/storage';
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { Items } from '../mocks/providers/items';
import { Settings } from '../providers';
import { MyApp } from './app.component';
import { Toast } from '@ionic-native/toast/ngx';
// The translate loader needs to know where to load i18n files
// in Ionic's static asset pipeline.
export function createTranslateLoader(http: HttpClient) {
return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}
export function provideSettings(storage: Storage) {
/**
* The Settings provider takes a set of default settings for your app.
*
* You can add new settings options at any time. Once the settings are saved,
* these values will not overwrite the saved values (this can be done manually if desired).
*/
return new Settings(storage, {
option1: true,
option2: 'Ionitron J. Framework',
option3: '3',
option4: 'Hello'
});
}
@NgModule({
declarations: [
MyApp
],
imports: [
BrowserModule,
HttpClientModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: (createTranslateLoader),
deps: [HttpClient]
}
}),
IonicModule.forRoot(MyApp),
IonicStorageModule.forRoot()
],
bootstrap: [IonicApp],
entryComponents: [
MyApp
],
providers: [
Items,
Camera,
SplashScreen,Toast,
StatusBar,
{ provide: Settings, useFactory: provideSettings, deps: [Storage] },
// Keep this to enable Ionic's runtime error handling during development
{ provide: ErrorHandler, useClass: IonicErrorHandler },
SQLite
]
})
export class AppModule { }
package.json
{
"name": "bmi2",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"start": "ionic-app-scripts serve",
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"lint": "ionic-app-scripts lint"
},
"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/camera": "4.3.3",
"@ionic-native/core": "~4.18.0",
"@ionic-native/splash-screen": "~4.18.0",
"@ionic-native/sqlite": "^5.0.0",
"@ionic-native/status-bar": "~4.18.0",
"@ionic-native/toast": "^5.0.0",
"@ionic/storage": "^2.2.0",
"@ngx-translate/core": "8.0.0",
"@ngx-translate/http-loader": "^2.0.0",
"cordova-android": "7.1.4",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-ionic-keyboard": "^2.1.3",
"cordova-plugin-ionic-webview": "^2.3.2",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-statusbar": "^2.4.2",
"cordova-plugin-whitelist": "^1.3.3",
"cordova-plugin-x-toast": "2.7.2",
"cordova-sqlite-storage": "2.6.0",
"ionic-angular": "3.9.2",
"ionicons": "3.0.0",
"rxjs": "5.5.11",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.26"
},
"devDependencies": {
"@ionic/app-scripts": "3.2.1",
"typescript": "~2.6.2"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-whitelist": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-ionic-webview": {
"ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
},
"cordova-plugin-ionic-keyboard": {},
"cordova-sqlite-storage": {},
"cordova-plugin-x-toast": {}
},
"platforms": [
"android"
]
}
}
Version info
ionic (Ionic CLI) : 4.8.0 (C:\Users\Ashutosh\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : ionic-angular 3.9.2
@ionic/app-scripts : 3.2.1
Cordova:
cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
Cordova Platforms : android 7.1.4
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.3.2, (and 6 other plugins)
System:
Android SDK Tools : 26.1.1 (D:\androidSDK)
NodeJS : v10.13.0
npm : 6.4.1
OS : Windows 8.1
