Open4
DuckDB ことはじめ
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
がなかった
できた。
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;
ソース
参考