iiinova — where your digital self keeps evolving

Neil 🐧 @nook.sh · 12/11/2024

Update: you can also use @rphlmr.com 's visualizer (which seems cooler than mine tbh) with the following piece of code. I'm not sure there is a need to create a Nuxt module for that, or maybe I could create one to pass options to the viewer (and also embed Drizzle studio at the same time !)

$import { addCustomTab, startSubprocess } from "@nuxt/devtools-kit"; import type { Nuxt } from "nuxt/schema"; import { consola } from "consola"; export function setupDrizzleVisualizer(nuxt: Nuxt) { const { getProcess, terminate } = startSubprocess( { command: "npx", args: ["drizzle-lab", "visualizer", "--port", "64738"], env: { NODE_ENV: "production", }, cwd: nuxt.options.rootDir, }, { id: "nuxt-drizzle-lab--visualizer", name: "Drizzle Visualizer", }, ); const { stderr, stdout } = getProcess(); stdout?.on("data", (data) => { consola.log("`Drizzle:`", data.toString()); }); stderr?.on("data", (data) => { consola.error("`Drizzle:`", data.toString()); }); addCustomTab({ name: "dizzle-visualizer", title: "Drizzle Visualizer", icon: "simple-icons:drizzle", view: { type: "iframe", src: "http://127.0.0.1:64738", }, }); nuxt.hook("close", () => terminate()); }$

240