From b9f8fd9e5ccd8c3769693ca0af23dab6c8af7408 Mon Sep 17 00:00:00 2001 From: Alexander Wang Date: Mon, 13 Jan 2025 23:15:26 -0700 Subject: [PATCH] update doc --- d2js/js/README.md | 30 ++-------- d2js/js/test-bundle.js | 133 ----------------------------------------- 2 files changed, 4 insertions(+), 159 deletions(-) delete mode 100644 d2js/js/test-bundle.js diff --git a/d2js/js/README.md b/d2js/js/README.md index 6ab63712e..0afeb230b 100644 --- a/d2js/js/README.md +++ b/d2js/js/README.md @@ -31,42 +31,20 @@ bun add @terrastruct/d2 ## Usage -### Browser +D2.js uses webworkers to call a WASM file. ```javascript +// Same for Node or browser import { D2 } from '@terrastruct/d2'; +// Or using a CDN +// import { D2 } from 'https://esm.sh/@terrastruct/d2'; const d2 = new D2(); const result = await d2.compile('x -> y'); const svg = await d2.render(result.diagram); - -const result = await d2.compile('x -> y', { - layout: 'dagre', - sketch: true -}); ``` -### Node - -```javascript -import { D2 } from '@terrastruct/d2'; - -const d2 = new D2(); - -async function createDiagram() { - const result = await d2.compile('x -> y'); - const svg = await d2.render(result.diagram); - console.log(svg); -} - -createDiagram(); -``` - -### Edge/CDN - -TODO - ## API Reference ### `new D2()` diff --git a/d2js/js/test-bundle.js b/d2js/js/test-bundle.js deleted file mode 100644 index e6fc6d08d..000000000 --- a/d2js/js/test-bundle.js +++ /dev/null @@ -1,133 +0,0 @@ -// test-bundle.js -import { build } from "bun"; -import { mkdir, writeFile } from "node:fs/promises"; -import { join } from "node:path"; - -// Ensure output directory exists -await mkdir("./test-dist", { recursive: true }); - -// First, write a temporary platform.js that uses browser code -const platformContent = `export * from "./platform.browser.js";`; -await writeFile("./src/platform.js", platformContent); - -console.log("Building main bundle..."); -const result = await build({ - entrypoints: ["./src/index.js"], - outdir: "./test-dist", - format: "esm", - target: "browser", - platform: "browser", - minify: true, -}); - -if (!result.success) { - console.error("Main bundle build failed:", result.logs); - process.exit(1); -} - -console.log("Building worker bundle..."); -const workerResult = await build({ - entrypoints: ["./src/worker.js"], - outdir: "./test-dist", - format: "esm", - target: "browser", - platform: "browser", - minify: true, -}); - -if (!workerResult.success) { - console.error("Worker bundle build failed:", workerResult.logs); - process.exit(1); -} - -console.log("Builds complete"); - -// Create a simple server to serve the bundles -const server = Bun.serve({ - port: 3001, - async fetch(req) { - const url = new URL(req.url); - - try { - // Serve main bundle - if (url.pathname === "/d2.mjs") { - const file = await Bun.file("./test-dist/index.js").text(); - return new Response(file, { - headers: { - "Content-Type": "application/javascript", - "Access-Control-Allow-Origin": "*", - }, - }); - } - - // Serve worker bundle - if (url.pathname === "/worker.js") { - const file = await Bun.file("./test-dist/worker.js").text(); - return new Response(file, { - headers: { - "Content-Type": "application/javascript", - "Access-Control-Allow-Origin": "*", - }, - }); - } - - // Serve test page - if (url.pathname === "/") { - return new Response( - ` - - - - D2 Test - - - -
- - - `, - { - headers: { - "Content-Type": "text/html", - "Content-Security-Policy": - "script-src 'unsafe-inline' 'wasm-unsafe-eval' http://localhost:3001; " + - "worker-src 'self' blob:; " + - "script-src-elem 'unsafe-inline' http://localhost:3001 blob:", - }, - } - ); - } - - return new Response("Not found", { status: 404 }); - } catch (error) { - console.error(`Error serving ${url.pathname}:`, error); - return new Response("Server Error", { status: 500 }); - } - }, -}); - -console.log(`Test server running at http://localhost:${server.port}/`);