avoid top-level await; import npm:sql.js (#1759)

* avoid top-level await; import npm:sql.js * comment * restore SQLite * remove DuckDB top-level await * fix SQLite export
observablehq · Nov 2, 2024 · 2b4a42b · 2b4a42b
1 parent 38fbffa
commit 2b4a42b
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 10 deletions.
diff --git a/docs/lib/sqlite.md b/docs/lib/sqlite.md
@@ -6,6 +6,14 @@
 import SQLite from "npm:@observablehq/sqlite";
 ```
 
+If you prefer to use sql.js directly, you can import and initialize it like so:
+
+```js run=false
+import initSqlJs from "npm:sql.js";
+
+const SQLite = await initSqlJs({locateFile: (name) => import.meta.resolve("npm:sql.js/dist/") + name});
+```
+
 We also provide `SQLiteDatabaseClient`, a [`DatabaseClient`](https://observablehq.com/@observablehq/database-client-specification) implementation.
 
 ```js run=false

diff --git a/src/client/stdlib/sqlite.js b/src/client/stdlib/sqlite.js
@@ -1,10 +1,6 @@
-// https://github.com/sql-js/sql.js/issues/284
-const SQLite = await (async () => {
-  const exports = {};
-  const response = await fetch(import.meta.resolve("npm:sql.js/dist/sql-wasm.js"));
-  new Function("exports", await response.text())(exports);
-  return exports.Module({locateFile: (name) => import.meta.resolve("npm:sql.js/dist/") + name});
-})();
+import initSqlJs from "npm:sql.js";
+
+const SQLite = initSqlJs({locateFile: (name) => import.meta.resolve("npm:sql.js/dist/") + name});
 
 export default SQLite;
 
@@ -15,7 +11,8 @@ export class SQLiteDatabaseClient {
     });
   }
   static async open(source) {
-    return new SQLiteDatabaseClient(new SQLite.Database(await load(await source)));
+    const [sqlite, data] = await Promise.all([SQLite, Promise.resolve(source).then(load)]);
+    return new SQLiteDatabaseClient(new sqlite.Database(data));
   }
   async query(query, params) {
     return await exec(this._db, query, params);

diff --git a/src/npm.ts b/src/npm.ts
@@ -83,14 +83,22 @@ export async function populateNpmCache(root: string, path: string): Promise<stri
   let promise = npmRequests.get(outputPath);
   if (promise) return promise; // coalesce concurrent requests
   promise = (async () => {
-    const specifier = extractNpmSpecifier(path);
+    let specifier = extractNpmSpecifier(path);
+    const s = parseNpmSpecifier(specifier);
+    // https://github.com/sql-js/sql.js/issues/284
+    if (s.name === "sql.js" && s.path === "+esm") {
+      specifier = formatNpmSpecifier({...s, path: "dist/sql-wasm.js"});
+    }
     const href = `https://cdn.jsdelivr.net/npm/${specifier}`;
     console.log(`npm:${specifier} ${faint("→")} ${outputPath}`);
     const response = await fetch(href);
     if (!response.ok) throw new Error(`unable to fetch: ${href}`);
     await mkdir(dirname(outputPath), {recursive: true});
     if (/^application\/javascript(;|$)/i.test(response.headers.get("content-type")!)) {
-      const source = await response.text();
+      let source = await response.text();
+      if (s.name === "sql.js" && s.path === "+esm") {
+        source = "var module;\n" + source + "\nexport default initSqlJs;";
+      }
       const resolver = await getDependencyResolver(root, path, source);
       await writeFile(outputPath, rewriteNpmImports(source, resolver), "utf-8");
     } else {