SolidJS•2mo ago

how do i use Drizzle?

I'm trying to use Drizzle db on the server only and its giving me "Uncaught TypeError: promisify is not a function" in the browser.

import { cache, createAsync } from "@solidjs/router";
import { db } from "~/lib/db";

const getData = cache(() => {
  return db.query.chat.findMany();
}, "data");

export const route = { load: getData };

export default function Home() {
  const data = createAsync(() => getData());

  return <p>{data()?.length}</p>;
}

import { cache, createAsync } from "@solidjs/router";
import { db } from "~/lib/db";

const getData = cache(() => {
  return db.query.chat.findMany();
}, "data");

export const route = { load: getData };

export default function Home() {
  const data = createAsync(() => getData());

  return <p>{data()?.length}</p>;
}

this is what lib/db looks like

import Database from "better-sqlite3";
import { drizzle } from "drizzle-orm/better-sqlite3";
import * as schema from "./schema";
import { migrate } from "drizzle-orm/better-sqlite3/migrator";

export const db = drizzle(new Database("db.sqlite"), { schema });
migrate(db, { migrationsFolder: "drizzle" });

import Database from "better-sqlite3";
import { drizzle } from "drizzle-orm/better-sqlite3";
import * as schema from "./schema";
import { migrate } from "drizzle-orm/better-sqlite3/migrator";

export const db = drizzle(new Database("db.sqlite"), { schema });
migrate(db, { migrationsFolder: "drizzle" });

40 Replies

Brendonovich•2mo ago

i think you're missing a use server lol, it's trying to run the query on the client

Hussein•2mo ago

in cache?

Brendonovich•2mo ago

yeah

Hussein•2mo ago

same error

Brendonovich•2mo ago

where'd u put it?

Hussein•2mo ago

import { cache, createAsync } from "@solidjs/router";
import { db } from "~/lib/db";

const getData = cache(() => {
  "use server";
  return db.query.chat.findMany();
}, "data");

export const route = { load: getData };

export default function Home() {
  const data = createAsync(() => getData());

  return <p>{data()?.length}</p>;
}

import { cache, createAsync } from "@solidjs/router";
import { db } from "~/lib/db";

const getData = cache(() => {
  "use server";
  return db.query.chat.findMany();
}, "data");

export const route = { load: getData };

export default function Home() {
  const data = createAsync(() => getData());

  return <p>{data()?.length}</p>;
}

import { defineConfig } from "@solidjs/start/config";

export default defineConfig({
  vite: { ssr: { external: ["better-sqlite3", "drizzle-orm"] } },
});

import { defineConfig } from "@solidjs/start/config";

export default defineConfig({
  vite: { ssr: { external: ["better-sqlite3", "drizzle-orm"] } },
});

and i also put this in config didn't work

Brendonovich•2mo ago

oh definitely remove those

Hussein•2mo ago

saw it in prisma example lol https://github.com/solidjs/solid-start/blob/main/examples/with-prisma/app.config.ts

Brendonovich•2mo ago

no idea why they do that

Hussein•2mo ago

removing it didn't fix tho...

Brendonovich•2mo ago

try deleting node_modules/.vinxi and restart the dev server, and remove the migrate call

Hussein•2mo ago

i deleted node_modules/.vinxi, but what is the migrate call? oh in drizzle ok did it, it didn't work

apollo79•2mo ago

I had some issues with prisma as well, moving the data functions (cache) to a different file made them go away (make the whole file "use server")

Brendonovich•2mo ago

ah you wouldn't want the whole file to be use server if you're calling cache in there but yea a separate file might help

Hussein•2mo ago

even if i get it work, this is honestly not as straightforward as sveltekit. in sveltekit you keep all your stuff in a file designed for server, +page.server.ts so its much more easy and noob-friendly doing that i got

|- Error: Export from a 'use server' module must be a function

Brendonovich•2mo ago

are you doing

const getData = cache(() => {
  "use server";
  return db.query.chat.findMany();
}, "data");

const getData = cache(() => {
  "use server";
  return db.query.chat.findMany();
}, "data");

"use server";

const getData = cache(() => {
  return db.query.chat.findMany();
}, "data");

"use server";

const getData = cache(() => {
  return db.query.chat.findMany();
}, "data");

i'd say this is kinda by design - start & router try to be fairly hands off. you're given primitives to build how you want

Hussein•2mo ago

"use server";

import Database from "better-sqlite3";
import { drizzle } from "drizzle-orm/better-sqlite3";
import * as schema from "./schema";
import { cache } from "@solidjs/router";
import { getCookie } from "vinxi/http";
import { eq } from "drizzle-orm";

export const db = drizzle(new Database("db.sqlite"), { schema });
export const getChat = cache(async () => {
  "use server";

  const cookie = getCookie("chat_session");
  if (!cookie) return null;

  const currChat = await db.query.chat.findFirst({
    where: eq(schema.chat.id, cookie),
  });

  return currChat;
}, "chat");

"use server";

import Database from "better-sqlite3";
import { drizzle } from "drizzle-orm/better-sqlite3";
import * as schema from "./schema";
import { cache } from "@solidjs/router";
import { getCookie } from "vinxi/http";
import { eq } from "drizzle-orm";

export const db = drizzle(new Database("db.sqlite"), { schema });
export const getChat = cache(async () => {
  "use server";

  const cookie = getCookie("chat_session");
  if (!cookie) return null;

  const currChat = await db.query.chat.findFirst({
    where: eq(schema.chat.id, cookie),
  });

  return currChat;
}, "chat");

Brendonovich•2mo ago

if you're after a simpler (and more stable lol) dx then sveltekit is defs a better option

Hussein•2mo ago

i'm doing this i like solid because of the <Suspense> and cache architecture

Brendonovich•2mo ago

remove the top level use server - you can only use that if all the exports are plain functions

Hussein•2mo ago

so should i create a getDb function and return the drizzle db?

Brendonovich•2mo ago

no just remove the top level use server

Hussein•2mo ago

ok and then? it doesn't work

Brendonovich•2mo ago

what did you do about your original getData function

Hussein•2mo ago

import Database from "better-sqlite3";
import { drizzle } from "drizzle-orm/better-sqlite3";
import * as schema from "./schema";
import { cache } from "@solidjs/router";
import { getCookie } from "vinxi/http";
import { eq } from "drizzle-orm";

export const db = drizzle(new Database("db.sqlite"), { schema });
export const getChat = cache(async () => {
  "use server";

  const cookie = getCookie("chat_session");
  if (!cookie) return null;

  const currChat = await db.query.chat.findFirst({
    where: eq(schema.chat.id, cookie),
  });

  return currChat;
}, "chat");

import Database from "better-sqlite3";
import { drizzle } from "drizzle-orm/better-sqlite3";
import * as schema from "./schema";
import { cache } from "@solidjs/router";
import { getCookie } from "vinxi/http";
import { eq } from "drizzle-orm";

export const db = drizzle(new Database("db.sqlite"), { schema });
export const getChat = cache(async () => {
  "use server";

  const cookie = getCookie("chat_session");
  if (!cookie) return null;

  const currChat = await db.query.chat.findFirst({
    where: eq(schema.chat.id, cookie),
  });

  return currChat;
}, "chat");