Open4

DuckDB ことはじめ

SENKENSENKEN
yarn
yarn workspace @duckdb/duckdb-wasm-examples-esbuild-browser build

をしてみたが動かん

$ node ./bundle.mjs && tsc --noEmit
node:internal/modules/cjs/loader:1285
  const err = new Error(`Cannot find module '${request}'`);
              ^

Error: Cannot find module '/home/senken/personal/duckdb-wasm/examples/esbuild-browser/node_modules/@duckdb/duckdb-wasm/dist/duckdb-node.cjs'
    at createEsmNotFoundErr (node:internal/modules/cjs/loader:1285:15)
    at finalizeEsmResolution (node:internal/modules/cjs/loader:1273:15)
    at resolveExports (node:internal/modules/cjs/loader:639:14)
    at Module._findPath (node:internal/modules/cjs/loader:747:31)
    at Module._resolveFilename (node:internal/modules/cjs/loader:1234:27)
    at Function.resolve (node:internal/modules/helpers:135:19)
    at file:///home/senken/personal/duckdb-wasm/examples/esbuild-browser/bundle.mjs:7:42
    at ModuleJob.run (node:internal/modules/esm/module_job:262:25)
    at async onImport.tracePromise.__proto__ (node:internal/modules/esm/loader:482:26)
    at async asyncRunEntryPointWithESMLoader (node:internal/modules/run_main:117:5) {
  code: 'MODULE_NOT_FOUND',
  path: '/home/senken/personal/duckdb-wasm/examples/esbuild-browser/node_modules/@duckdb/duckdb-wasm/package.json'
}

/home/senken/personal/duckdb-wasm/examples/esbuild-browser/node_modules/@duckdb/duckdb-wasm/package.jsonはあるんだけどな、、
違った、/home/senken/personal/duckdb-wasm/examples/esbuild-browser/node_modules/@duckdb/duckdb-wasm/dist/duckdb-node.cjs がなかった

SENKENSENKEN

できた。

pnpm create vite
# React, TypeScript
pnpm i @duckdb/duckdb-wasm apache-arrow
App.tsx
import { useEffect, useState } from "react";
import "./App.css";

import * as duckdb from "@duckdb/duckdb-wasm";
import duckdb_wasm from "@duckdb/duckdb-wasm/dist/duckdb-mvp.wasm?url";
import mvp_worker from "@duckdb/duckdb-wasm/dist/duckdb-browser-mvp.worker.js?url";
import duckdb_wasm_eh from "@duckdb/duckdb-wasm/dist/duckdb-eh.wasm?url";
import eh_worker from "@duckdb/duckdb-wasm/dist/duckdb-browser-eh.worker.js?url";

import type { Int } from "apache-arrow";

const MANUAL_BUNDLES: duckdb.DuckDBBundles = {
  mvp: {
    mainModule: duckdb_wasm,
    mainWorker: mvp_worker,
  },
  eh: {
    mainModule: duckdb_wasm_eh,
    mainWorker: eh_worker,
  },
};

function App() {
  const [result, setResult] = useState<any>(null);

  useEffect(() => {
    (async () => {
      // Select a bundle based on browser checks
      const bundle = await duckdb.selectBundle(MANUAL_BUNDLES);
      // Instantiate the asynchronous version of DuckDB-wasm
      const worker = new Worker(bundle.mainWorker!);
      const logger = new duckdb.ConsoleLogger();
      const db = new duckdb.AsyncDuckDB(logger, worker);
      await db.instantiate(bundle.mainModule, bundle.pthreadWorker);

      const conn = await db.connect();
      setResult(
        await conn.query<{ v: Int }>(
          `SELECT count(*)::INTEGER as v FROM generate_series(0, 100) t(v)`
        )
      );

      await conn.close();
      await db.terminate();
      await worker.terminate();
    })();
  }, []);

  return (
    <>
      <pre style={{ textAlign: "left" }}>
        {JSON.stringify(result, undefined, 2)}
      </pre>
    </>
  );
}

export default App;

ソース
https://github.com/senkenn/duckdb-wasm-test

参考
https://zenn.dev/yuiseki/articles/d89aaba0eb80c6