Error while creating a mutation in NextJS

"message": "No \"query\"-procedure on path \"checkout.stripe\"",
"code": -32004,

"message": "No \"query\"-procedure on path \"checkout.stripe\"",
"code": -32004,

import { createTRPCRouter, publicProcedure } from "@/server/api/trpc";

export const checkoutRouter = createTRPCRouter({
  stripe: publicProcedure.mutation(() => {
    return "Hello";
  }),
});

import { createTRPCRouter, publicProcedure } from "@/server/api/trpc";

export const checkoutRouter = createTRPCRouter({
  stripe: publicProcedure.mutation(() => {
    return "Hello";
  }),
});