SolidJS•7mo 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•7mo ago

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

HusseinOP•7mo ago

in cache?

Brendonovich•7mo ago

yeah

HusseinOP•7mo ago

same error

Brendonovich•7mo ago

where'd u put it?

HusseinOP•7mo 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•7mo ago

oh definitely remove those

HusseinOP•7mo ago

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

Brendonovich•7mo ago

no idea why they do that

HusseinOP•7mo ago

removing it didn't fix tho...

Brendonovich•7mo ago

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

HusseinOP•7mo ago

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

apollo79•7mo 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•7mo 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

HusseinOP•7mo 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•7mo 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

HusseinOP•7mo 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•7mo ago

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

HusseinOP•7mo ago

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

Brendonovich•7mo ago

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

HusseinOP•7mo ago

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

Brendonovich•7mo ago

no just remove the top level use server

HusseinOP•7mo ago

ok and then? it doesn't work

Brendonovich•7mo ago

what did you do about your original getData function

HusseinOP•7mo 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");