locohost Posts - Answer Overflow

locohost

Explore posts from servers

•Created by locohost on 4/20/2024 in #pages-help

I must be missing a bit on CF Pages "functions" folder, it never works for me

pages.dev: https://a37dd34e.lkg-pages-hono.pages.dev deployment id: a37dd34e-3951-4c09-b03a-0ba7b7eca80c account id: 97b74a45f478725ddc37f3f1ddc20277 I have a fairly basic CFP project. It's Typescript, Hono, Drizzle, Tailwindcss with Vite and uses CF KV for auth/users/sessions. It's in really good shape and is fully functional but for one part I just can't seem to "wrangle" 😉 I'd like to move the code that talks to KV and later D1 into "functions". I mean I can certainly create a "repos" folder and put the db code in files there, but I thought it would be fun to try functions in CFP. I added a "functions" folder in project root. I put the example.ts file from the CF docs. I've tried other files too. So far, functions does nothing for me. No function ever works local or deploys and works. My build and deploy scripts in package.json are...

"scripts": {
    "dev": "vite",
    "build": "vite build",
    "deploy:prev": "vite build && wrangler pages deploy --branch preview",
    "deploy:prod": "vite build && wrangler pages deploy --branch production"
  },

"scripts": {
    "dev": "vite",
    "build": "vite build",
    "deploy:prev": "vite build && wrangler pages deploy --branch preview",
    "deploy:prod": "vite build && wrangler pages deploy --branch production"
  },

My vite.config.ts looks like...

import build from '@hono/vite-cloudflare-pages'
import devServer from '@hono/vite-dev-server'
import adapter from '@hono/vite-dev-server/cloudflare'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [
    build(),
    devServer({
      adapter,
      entry: 'src/index.tsx'
    })
  ]
})

import build from '@hono/vite-cloudflare-pages'
import devServer from '@hono/vite-dev-server'
import adapter from '@hono/vite-dev-server/cloudflare'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [
    build(),
    devServer({
      adapter,
      entry: 'src/index.tsx'
    })
  ]
})

I'm sure there is one magic step I'm not seeing in docs so here I am 🙂

7 replies

Gaming

Programming