{"id":44263,"library":"angular-web-sqlite","title":"angular-web-sqlite","description":"Angular service wrapping @sqlite.org/sqlite-wasm for using SQLite in the browser with OPFS storage. Version 1.0.34, released periodically. Key differentiators: integrates seamlessly with Angular via dependency injection, manages Web Worker communication for SQLite ops, supports batch transactions. Uses Origin Private File System for persistent storage. Requires specific Angular/Common and Ionic peer dependencies and special Angular asset configuration.","status":"active","version":"1.0.34","language":"javascript","source_language":"en","source_url":"https://github.com/diegolijo/angular-web-sqlite","tags":["javascript","angular","sqlite","web","typescript"],"install":[{"cmd":"npm install angular-web-sqlite","lang":"bash","label":"npm"},{"cmd":"yarn add angular-web-sqlite","lang":"bash","label":"yarn"},{"cmd":"pnpm add angular-web-sqlite","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency; required for Angular common features","package":"@angular/common","optional":true},{"reason":"Peer dependency; required for Angular core features","package":"@angular/core","optional":true},{"reason":"Peer dependency; required for Ionic integration","package":"@ionic/angular","optional":true}],"imports":[{"note":"ESM-only; TypeScript types included.","wrong":"const WebSqlite = require('angular-web-sqlite');","symbol":"WebSqlite","correct":"import { WebSqlite } from 'angular-web-sqlite';"},{"note":"Must be added as a provider in Angular module or component.","wrong":"WebSqlite in imports array","symbol":"WebSqlite as provider","correct":"providers: [WebSqlite]"},{"note":"Use TypeScript type safety.","wrong":"constructor(private webSqlite: any) {}","symbol":"WebSqlite injection","correct":"constructor(private webSqlite: WebSqlite) {}"}],"quickstart":{"code":"// app.module.ts\nimport { NgModule } from '@angular/core';\nimport { BrowserModule } from '@angular/platform-browser';\nimport { WebSqlite } from 'angular-web-sqlite';\nimport { AppComponent } from './app.component';\n\n@NgModule({\n  declarations: [AppComponent],\n  imports: [BrowserModule],\n  providers: [WebSqlite],\n  bootstrap: [AppComponent]\n})\nexport class AppModule { }\n\n// app.component.ts\nimport { Component } from '@angular/core';\nimport { WebSqlite } from 'angular-web-sqlite';\n\n@Component({\n  selector: 'app-root',\n  template: '<button (click)=\"run()\">Run SQL</button>'\n})\nexport class AppComponent {\n  constructor(private db: WebSqlite) {}\n\n  async run() {\n    await this.db.init('mydb');\n    await this.db.executeSql('CREATE TABLE IF NOT EXISTS test (id INTEGER PRIMARY KEY, name TEXT)', []);\n    await this.db.executeSql('INSERT INTO test (name) VALUES (?)', ['Alice']);\n    const result = await this.db.executeSql('SELECT * FROM test', []);\n    console.log(result);\n  }\n}","lang":"typescript","description":"Shows initialization and basic CRUD with WebSqlite service."},"warnings":[{"fix":"Add headers in angular.json serve options as shown in README.","message":"Requires Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy headers for SharedArrayBuffer support.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Configure assets in angular.json build options.","message":"Must copy assets from angular-web-sqlite and @sqlite.org/sqlite-wasm to output directory sqlite-client.","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Install @ionic/angular if needed, otherwise ignore.","message":"Peer dependency on @ionic/angular may become optional in future versions.","severity":"deprecated","affected_versions":">=1.0.0"},{"fix":"Use async/await or .then() when calling methods.","message":"Methods return Promises; must use await or .then().","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"search_vec":"'/sqlite-wasm':10 '1.0.34':21 'angular':2,5,29,60,64 'angular-web-sqlit':1 'angular/common':53 'asset':61 'batch':41 'browser':16 'communic':36 'configur':62 'depend':31,57 'differenti':25 'file':46 'inject':32 'integr':26 'ionic':55 'javascript':63 'key':24 'manag':33 'op':39 'opf':18 'origin':44 'peer':56 'period':23 'persist':49 'privat':45 'releas':22 'requir':51 'seamless':27 'servic':6 'special':59 'specif':52 'sqlite':4,13,38,65 'sqlite.org':9 'sqlite.org/sqlite-wasm':8 'storag':19,50 'support':40 'system':47 'transact':42 'typescript':67 'use':12,43 'version':20 'via':30 'web':3,34,66 'worker':35 'wrap':7","created_at":"2026-06-07T12:49:16.039317+00:00","updated_at":"2026-06-07T12:49:16.039317+00:00","problems":[{"fix":"Add asset configuration in angular.json build options.","cause":"Missing copy of assets from sqlite-wasm package.","error":"Error: Module not found: Error: Can't resolve '@sqlite.org/sqlite-wasm'"},{"fix":"Call await this.webSqlite.init(dbName) before any query.","cause":"Database not initialized before executing query.","error":"TypeError: Cannot read properties of undefined (reading 'executeSql')"},{"fix":"Add headers in angular.json serve options.","cause":"Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy headers not set.","error":"SecurityError: Failed to construct 'Worker'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://github.com/diegolijo/angular-web-sqlite#readme","github":"https://github.com/diegolijo/angular-web-sqlite","docs":null,"changelog":null,"pypi":null,"npm":"angular-web-sqlite","openapi_spec":null,"status_page":null,"smithery":null,"categories":["database"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-07","next_check":"2026-09-05","install_tag":null}}