electric-sql / pglite

Lightweight Postgres packaged as WASM into a TypeScript library for the browser, Node.js, Bun and Deno
https://electric-sql.com
Apache License 2.0
4.76k stars 81 forks source link

Error: expected magic word 00 61 73 6d, found 3c 21 44 4f @+0 #96

Closed barbalex closed 4 weeks ago

barbalex commented 1 month ago

I tried to use pglite instead of sqlite: https://github.com/barbalex/ps/commit/5c3c44f731c6e492e9ee150cd97e64ba61dfb093, following these: https://electric-sql.com/blog/2024/05/14/electricsql-postgres-client-support, https://electric-sql.com/docs/integrations/drivers/web/pglite

When starting the app (after rebuilding docker, migrating the db, generating the client and emptying the browser cache) this error appears in the console:

RuntimeError: Aborted(CompileError: WebAssembly.instantiate(): expected magic word 00 61 73 6d, found 3c 21 44 4f @+0). Build with -sASSERTIONS for more info
Screenshot 2024-06-02 124248

I probably flubbed the migration?

I am working on Windows 11 using nodejs v22.2.0

Also tried it on my MacOS notebook. Same error.

lecstor commented 4 weeks ago

I get the same message when calling new PGlite() in a newly generated Vite app. (and a different error when running in Safari)

Screenshot 2024-06-05 at 7 42 44 AM

Arc (Chrome): WebAssembly.instantiate(): expected magic word 00 61 73 6d, found 3c 21 64 6f @+0)

Screenshot 2024-06-05 at 7 44 22 AM

Safari: WebAssembly.Module doesn't parse at byte 0: module doesn't start with '\0asm')

Screenshot 2024-06-05 at 7 49 37 AM

Firefox: wasm validation error: at offset 4: failed to match magic number

Screenshot 2024-06-05 at 7 54 18 AM
lecstor commented 4 weeks ago

Solved

@barbalex maybe have a look at your server setup, it appears that error is due to the wasm file not being served correctly.

https://github.com/WebAssembly/spec/issues/1031

Those bytes are "<!DO" in ASCII, so probably you are trying to load an HTML document.

I was able to resolve this using the Vite config from the sqlite-wasm readme.. https://github.com/sqlite/sqlite-wasm?tab=readme-ov-file#usage-with-vite

import { defineConfig } from 'vite';

export default defineConfig({
  optimizeDeps: {
    exclude: ["@electric-sql/pglite"],
  },
});
Screenshot 2024-06-05 at 8 20 29 AM Screenshot 2024-06-05 at 8 21 07 AM
barbalex commented 4 weeks ago

@lecstor Thanks a lot. Your input solved the issue.

In case others bump into this when migrating from using sqlite: I had these issues to solve:

  1. exclude @electric-sql/pglite in optimizeDeps in vite.config.ts as mentioned by @lecstor: https://github.com/barbalex/ps/blob/pglite/vite.config.ts#L9-L17
  2. import electrify from electric-sql/pglite, no more from electric-sql/wa-sqlite (I had forgotten to change that): https://github.com/barbalex/ps/blob/ce105ae1b806f5adc94441ab4f5e09da35660b5e/src/ElectricWrapper.tsx#L3
  3. Now npm i failed due to better-sqlite3 failing to build native sqlite (it seems that electric-sql@0.11.3 needs better-sqlite3). I had to downgrade my local node.js from 22.2 to the 20.x lts version (dont know why this didn't happen earlier)

Now I am running into issues due to syntax error at or near "PRAGMA". But I guess that is to be expected as the app uses pragma sql calls to set up on startup and that has to be altered for PostgreSQL.

barbalex commented 4 weeks ago

issue solved