honox + auth.js

[BarryThePenguin]

What version of HonoX are you using?

0.1.23

What steps can reproduce the bug?

I created a minimal reproduction https://github.com/BarryThePenguin/honox-auth-js

There's a few issues..

1. Running the dev server fails with..

[vite] Internal server error: exports is not defined
      at eval (/honojs/honox-auth-js/node_modules/.pnpm/cookie@0.6.0/node_modules/cookie/index.js:17:1)
      at instantiateModule (file:////honojs/honox-auth-js/node_modules/.pnpm/vite@5.3.3/node_modules/vite/dist/node/chunks/dep-CzJTQ5q7.js:53451:11)

2. Running the dev server fails with..

   [auth][error] MissingSecret: Please define a `secret`..

   I have a secret defined in wrangler.toml, but this doesn't appear to make it to the auth handler. The c.env will have the correct environment variables. But env(c) returns something different, which is what @hono/auth-js uses

https://github.com/honojs/middleware/blob/67b83e5d4cc1bcbbf1d7024a721cec69f3d4ead0/packages/auth-js/src/index.ts#L149

env(c) appears to be returning process.env, which is missing the environment variables from wrangler.toml

3. Deploying to Cloudflare Pages fails with..

> wrangler pages dev

 ⛅️ wrangler 3.63.1
-------------------

✘ [ERROR] Could not resolve "crypto"

    _worker.js:1:519:
      1 │ ...et(e,r),r);import*as vn from"crypto";import{createHmac as En}fro...
        ╵                                ~~~~~~~~

  The package "crypto" wasn't found on the file system but is built into node. Are you trying to bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

✘ [ERROR] Failed to build _worker.js.

You can reproduce this locally by building the app and running wrangler pages dev

What is the expected behavior?

Even without values for AUTH_GITHUB_ID and AUTH_GITHUB_SECRET, I'd expect to be redirected to /api/auth/signin

From https://authjs.dev/getting-started/authentication/oauth

AUTH_GITHUB_ID={CLIENT_ID}
AUTH_GITHUB_SECRET={CLIENT_SECRET}

Auth.js will automatically pick up these if formatted like the example above. You can also use a different name for the environment variables if needed, but then you’ll need to pass them to the provider manually.

So I'd expect Auth.js to pickup the environment variables automatically

What do you see instead?

No response

Additional information

No response

[yusukebe]

Hi @BarryThePenguin !

Try to update @hono/vite-dev-server and @hono/cloudflare-pages, and use the following vite.config.ts:

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

export default defineConfig({
  ssr: {
    external: ['@auth/core']
  },
  plugins: [
    honox({
      devServer: {
        adapter
      }
    }),
    pages()
  ]
})

[BarryThePenguin]

Fantastic, that solved all 3 issues, thank you!