Jacob
Jacob
Explore posts from servers
CDCloudflare DevelopersRRailwayTtRPCHHono
PostsComments
CDCloudflare Developers
Created by Jacob on 8/9/2024 in #workers-help
vite-tsconfig-paths throws error when used in Worker vitest config
Hello, I'm using custom paths inside of my tsconfig, I've tried to make Vitest compatible with them using the vite-tsconfig-paths plugin however it consistently gives me this error .. 
✘ [ERROR] "vite-tsconfig-paths" resolved to an ESM file. ESM file cannot be loaded by `require`. See https://vitejs.dev/guide/troubleshooting.html#this-package-is-esm-only for more details. [plugin externalize-deps]

    ../node_modules/vite/node_modules/esbuild/lib/main.js:1225:27:
      1225 │         let result = await callback({
           ╵                            ^
✘ [ERROR] "vite-tsconfig-paths" resolved to an ESM file. ESM file cannot be loaded by `require`. See https://vitejs.dev/guide/troubleshooting.html#this-package-is-esm-only for more details. [plugin externalize-deps]

    ../node_modules/vite/node_modules/esbuild/lib/main.js:1225:27:
      1225 │         let result = await callback({
           ╵                            ^
Vitest config 
import { defineWorkersConfig } from "@cloudflare/vitest-pool-workers/config";
import tsconfigPaths from 'vite-tsconfig-paths'

export default defineWorkersConfig({
  plugins: [tsconfigPaths()],
  test: {
    poolOptions: {
      workers: {
        wrangler: { configPath: "./wrangler.toml" },
        main: "./src/index.ts",
      },
    },
  },
});
import { defineWorkersConfig } from "@cloudflare/vitest-pool-workers/config";
import tsconfigPaths from 'vite-tsconfig-paths'

export default defineWorkersConfig({
  plugins: [tsconfigPaths()],
  test: {
    poolOptions: {
      workers: {
        wrangler: { configPath: "./wrangler.toml" },
        main: "./src/index.ts",
      },
    },
  },
});
Wrangler.toml 
name = "worldjourney-api"
compatibility_date = "2023-12-01"
main = "./src/index.ts"
compatibility_flags = [ "nodejs_compat" ]

[[kv_namespaces]]
binding = "TOKENS"
id = "<>"
preview_id = "<>"

[env.production]
route = "api.worldjourney.app"

[env.staging]
route = "staging.api.worldjourney.app"
name = "worldjourney-api"
compatibility_date = "2023-12-01"
main = "./src/index.ts"
compatibility_flags = [ "nodejs_compat" ]

[[kv_namespaces]]
binding = "TOKENS"
id = "<>"
preview_id = "<>"

[env.production]
route = "api.worldjourney.app"

[env.staging]
route = "staging.api.worldjourney.app"
2 replies
CDCloudflare Developers
Created by Jacob on 8/7/2024 in #workers-help
KV Namespace methods break when passed through constructor
Hey everyone, I'm trying to make my KV namespaces accessible in my services using dep injection with tsyringe. Is this something that is known to be unsupported? I found that after injecting the kv namespace the put() and get() methods seemingly blocks execution of anything coming after it, without any errors and no data being set or retrieved. I would prefer for my services to have the kv namespaces available instead of having to pass it from the request handler (hono with trpc) through to my repository class. I have a middleware for Hono set up like this. 
export const injectServices = createMiddleware(async (c: Context<{
  Bindings: ContextBindings,
  Variables: ContextVariables
}, any, {}>, next) => {
  const env = validateEnv(c);

  container.register('env', { useValue: env });
  container.register('tokenStore', { useValue: c.env.TOKEN /* KV Namespace */ })
  container.register('vision', GCPVisionService)

  // REPOS
  c.set('repositories', {
    VisionRepository: container.resolve(VisionRepository)
  });

  await next();
})
export const injectServices = createMiddleware(async (c: Context<{
  Bindings: ContextBindings,
  Variables: ContextVariables
}, any, {}>, next) => {
  const env = validateEnv(c);

  container.register('env', { useValue: env });
  container.register('tokenStore', { useValue: c.env.TOKEN /* KV Namespace */ })
  container.register('vision', GCPVisionService)

  // REPOS
  c.set('repositories', {
    VisionRepository: container.resolve(VisionRepository)
  });

  await next();
})
4 replies
HHono
Created by Jacob on 8/7/2024 in #help
Issues with Cloudflare KV
Hey everyone, I'm trying to make my KV namespaces accessible in my services using dep injection with tsyringe. Is this something that is known to be unsupported? I found that after injecting the kv namespace the put() and get() methods seemingly blocks execution of anything coming after it, without any errors and no data being set or retrieved. I would prefer for my services to have the kv namespaces available instead of having to pass it from the request handler (hono with trpc) through to my repository class. I have a middleware for Hono set up like this. 
export const injectServices = createMiddleware(async (c: Context<{
  Bindings: ContextBindings,
  Variables: ContextVariables
}, any, {}>, next) => {
  const env = validateEnv(c);

  container.register('env', { useValue: env });
  container.register('tokenStore', { useValue: c.env.TOKEN /* KV Namespace */ })
  container.register('vision', GCPVisionService)

  // REPOS
  c.set('repositories', {
    VisionRepository: container.resolve(VisionRepository)
  });

  await next();
})
export const injectServices = createMiddleware(async (c: Context<{
  Bindings: ContextBindings,
  Variables: ContextVariables
}, any, {}>, next) => {
  const env = validateEnv(c);

  container.register('env', { useValue: env });
  container.register('tokenStore', { useValue: c.env.TOKEN /* KV Namespace */ })
  container.register('vision', GCPVisionService)

  // REPOS
  c.set('repositories', {
    VisionRepository: container.resolve(VisionRepository)
  });

  await next();
})
5 replies
HHono
Created by Jacob on 6/2/2024 in #help
Posting files in multipart/form-data gives empty string
No description
2 replies
TtRPC
Created by Jacob on 5/27/2024 in #❓-help
Losing type-safety with merged routers
When using router exported from an external file, I lose any sort of type safety for the procedures on in that router. router.ts 
export const appRouter = router({
  users: usersRouter,
  test: {
    create: procedure.input(z.string()).query(({ input }) => {
      return 'Hi ' + input;
    }),
    list: procedure.input(z.string()).query(({ input }) => {
      return 'Hi ' + input;
    })
  }
})
export const appRouter = router({
  users: usersRouter,
  test: {
    create: procedure.input(z.string()).query(({ input }) => {
      return 'Hi ' + input;
    }),
    list: procedure.input(z.string()).query(({ input }) => {
      return 'Hi ' + input;
    })
  }
})
users.ts 
export const usersRouter = router({
  create: procedure.input(z.string()).query(({ input }) => {
    return 'Hi ' + input;
  }),
  list: procedure.input(z.string()).query(({ input }) => {
    return 'Hi ' + input;
  })
});
export const usersRouter = router({
  create: procedure.input(z.string()).query(({ input }) => {
    return 'Hi ' + input;
  }),
  list: procedure.input(z.string()).query(({ input }) => {
    return 'Hi ' + input;
  })
});
On my frontend I call the trpc object api api.test is typed as expected, api.users however is any. I can quite figure out what I'm doing wrong 🤔
5 replies
TtRPC
Created by Jacob on 11/5/2023 in #❓-help
The inferred type of 'trpc' cannot be named without a reference ...
No description
5 replies