Problem - capacitor-community/sqlite with jeep

Hi all,

I’m trying to get a new ionic angular application working with the @capacitor-community/sqlite library on Angular 19, Ionic v8 and capacitor 7.

Intitialising the database seems to work fine, but when I attempt to open it as part of the intialisation funciton, it fails on the db.open() with the following:

wasm streaming compile failed: LinkError: import object field 'I' is not a Function.

It’s not clear what’s causing this having been into the library code, the only suspicion I have so far is that the verisons aren’t compatible.

I’ve pulled the demo repo from the project README, installed everything and it works. The difference, other than the version of angular, ionic and capacitor, is unclear.

I’ll include some code below and I’d appreciate any help on the matter!

Thanks,
Jason.

package.json

{
  "name": "eyfs-parent-teacher-app",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "https://ionicframework.com/",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "ionic:serve:before": "npm run copy:sql:wasm",
    "copy:sql:wasm": "copyfiles -u 3 node_modules/sql.js/dist/sql-wasm.wasm src/assets",
    "watch": "ng build --watch --configuration development",
    "test": "ng test",
    "lint": "ng lint"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^19.0.0",
    "@angular/common": "^19.0.0",
    "@angular/compiler": "^19.0.0",
    "@angular/core": "^19.0.0",
    "@angular/forms": "^19.0.0",
    "@angular/platform-browser": "^19.0.0",
    "@angular/platform-browser-dynamic": "^19.0.0",
    "@angular/router": "^19.0.0",
    "@capacitor-community/sqlite": "^7.0.0",
    "@capacitor/app": "7.0.0",
    "@capacitor/core": "7.0.1",
    "@capacitor/haptics": "7.0.0",
    "@capacitor/ios": "7.0.1",
    "@capacitor/keyboard": "7.0.0",
    "@capacitor/splash-screen": "^7.0.0",
    "@capacitor/status-bar": "7.0.0",
    "@ionic/angular": "^8.4.3",
    "@ionic/core": "^8.4.3",
    "@ionic/pwa-elements": "^3.3.0",
    "@ionic/storage": "^4.0.0",
    "ionicons": "^7.0.0",
    "jeep-sqlite": "^2.8.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.15.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^19.0.0",
    "@angular-eslint/builder": "^19.0.0",
    "@angular-eslint/eslint-plugin": "^19.0.0",
    "@angular-eslint/eslint-plugin-template": "^19.0.0",
    "@angular-eslint/schematics": "^19.0.0",
    "@angular-eslint/template-parser": "^19.0.0",
    "@angular/cli": "^19.0.0",
    "@angular/compiler-cli": "^19.0.0",
    "@angular/language-service": "^19.0.0",
    "@capacitor/cli": "7.0.1",
    "@ionic/angular-toolkit": "^12.0.0",
    "@types/jasmine": "~5.1.0",
    "@typescript-eslint/eslint-plugin": "^8.18.0",
    "@typescript-eslint/parser": "^8.18.0",
    "copyfiles": "^2.4.1",
    "crypto-browserify": "^3.12.1",
    "eslint": "^9.16.0",
    "eslint-plugin-import": "^2.29.1",
    "eslint-plugin-jsdoc": "^48.2.1",
    "eslint-plugin-prefer-arrow": "1.2.2",
    "jasmine-core": "~5.1.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.1.0",
    "stream-browserify": "^3.0.0",
    "typescript": "~5.6.3",
    "vm-browserify": "^1.1.2"
  },
  "description": "An Ionic project"
}

database.service.ts

import {Injectable, signal} from '@angular/core';
import {CapacitorSQLite, SQLiteConnection, SQLiteDBConnection} from "@capacitor-community/sqlite";
import {Capacitor} from "@capacitor/core";

const DB_USERS = 'myuserdb';

export interface User {
  id: number;
  name: string;
  active: number;
}

@Injectable({
  providedIn: 'root'
})
export class DatabaseService {

  private sqlite: SQLiteConnection = new SQLiteConnection(CapacitorSQLite);
  private db!: SQLiteDBConnection;
  private users = signal<User[]>([]);

  constructor() { }

  getUsers()
  {
    return this.users;
  }

  async initWebStore(): Promise<void> {
    try {
      await this.sqlite.initWebStore();
    } catch(err: any) {
      const msg = err.message ? err.message : err;
      return Promise.reject(`initWebStore: ${err}`);
    }
  }

  async openDatabase(dbName:string, encrypted: boolean, mode: string, version: number, readonly: boolean): Promise<any> {
    let db: SQLiteDBConnection;
    const retCC = (await this.sqlite.checkConnectionsConsistency()).result;
    let isConn = (await this.sqlite.isConnection(dbName, readonly)).result;
    if(retCC && isConn) {
      db = await this.sqlite.retrieveConnection(dbName, readonly);
    } else {
      db = await this.sqlite
        .createConnection(dbName, encrypted, mode, version, readonly);
    }
    await db.open();
    return db;
  }

  async initialisePlugin()
  {

    await this.initWebStore()
      .then(async () => {

        await this.openDatabase(DB_USERS,
          false,
          'no-encryption',
          1,
          false)

        const schema = `CREATE TABLE IF NOT EXISTS users
                        (
                          id     INTEGER PRIMARY KEY AUTO_INCREMENT,
                          name   TEXT NOT NULL,
                          active INTEGER DEFAULT 1
                        );`;

        if( Capacitor.getPlatform() === 'web') {
          await this.sqlite.saveToStore(DB_USERS);
        }


        await this.db.execute(schema)
          .then(() => {
            this.loadUsers();
          });

        return true;
      })


  }

  //CRUD

  async loadUsers()
  {
    const users = await this.db.query('SELECT * FROM users;');

    this.users.set(users.values || []);
  }

  async addUser(name : String)
  {
    const query = `INSERT INTO users (name) VALUES ('${name}')`;

    const result = await this.db.query(query);

    await this.loadUsers();

    return result;
  }

  async updateUser(id : String, active : Number)
  {
    const query = `UPDATE users SET active = ${active} WHERE id = ${id}`;

    const result = await this.db.query(query);

    await this.loadUsers();

    return result;
  }

  async deleteUserById(id : String)
  {
    const query = `DELETE FROM users WHERE id = ${id}`;

    const result = await this.db.query(query);

    await this.loadUsers();

    return result;
  }
}

1 post - 1 participant

Read full topic