DT
Drizzle Team•2y ago
Droutin

Nuxt3 type error

Hello, is there somebody who used Drizzle in Nuxt3 project? I have problem with inheriting types from api, but only when I select specific columns from db. Server-side code shows correct types. Problem is on client-side, like you can see on photo. It gives mi correct type OR default type... Server-side 
import { sql } from "drizzle-orm";
import { clientSchema } from "~/server/schemas/clientSchema";
import { projectSchema } from "~/server/schemas/projectSchema";
import { drizzle } from "~/server/services/drizzle";
import { eq } from "drizzle-orm/expressions";

export default defineEventHandler(async () => {
    const projects = await drizzle
        .select({
            id: projectSchema.id,
            name: projectSchema.name,
            tariff: projectSchema.tariff,
            client: {
                id: clientSchema.id,
                name: clientSchema.name,
            },
        })
        .from(projectSchema)
        .leftJoin(clientSchema, eq(clientSchema.id, projectSchema.clientId))
        .where(sql`${projectSchema.deletedAt} IS NULL`);
    return projects;
});
import { sql } from "drizzle-orm";
import { clientSchema } from "~/server/schemas/clientSchema";
import { projectSchema } from "~/server/schemas/projectSchema";
import { drizzle } from "~/server/services/drizzle";
import { eq } from "drizzle-orm/expressions";

export default defineEventHandler(async () => {
    const projects = await drizzle
        .select({
            id: projectSchema.id,
            name: projectSchema.name,
            tariff: projectSchema.tariff,
            client: {
                id: clientSchema.id,
                name: clientSchema.name,
            },
        })
        .from(projectSchema)
        .leftJoin(clientSchema, eq(clientSchema.id, projectSchema.clientId))
        .where(sql`${projectSchema.deletedAt} IS NULL`);
    return projects;
});
Client-side 
const { data: projects } = await useFetch("/api/projects/", { method: "GET" });
const { data: projects } = await useFetch("/api/projects/", { method: "GET" });
1 Reply
Droutin
DroutinOP•2y ago
FIXED Its bug in Nuxt3. It inherited types from GET and POST endpoints. I needed to change uppercase GET to lowercase in client-side code, and it fixes itself.

Did you find this page helpful?