TheEdoRan / next-safe-action

Type safe and validated Server Actions in your Next.js (App Router) project.
https://next-safe-action.dev
MIT License
1.62k stars 26 forks source link

[BUG] TypeSchema breaks edge deployment and Turbopack dev server #49

Closed AlexisWalravens closed 5 months ago

AlexisWalravens commented 6 months ago

Are you using the latest version of this library?

Is there an existing issue for this?

Describe the bug

When deploying on Vercel with the Edge Runtime I get the following error:

Error: The Edge Function "[locale]" is referencing unsupported modules:
        - index.js: @deepkit/type, @effect/data/Either, @effect/schema/Schema, @effect/schema/TreeFormatter, fp-ts/Either, ow, valibot, yup

Reproduction steps

  1. Update to v6
  2. Create a layout/page
  3. add export const runtime = 'edge'at the top
  4. Use a safe server action created with this package in that page
  5. Deploy on Vercel

Expected behavior

It should work on the edge runtime as it did in v5

Reproduction example

https://github.com/AlexisWalravens/next-safe-action-edge-broken

Operating System

macOS 14.1.2

Library version

6.0.0

Additional context

Thanks for this package !

ISnackable commented 6 months ago

Additionally, to what @AlexisWalravens has mentioned, the new update also seems to break when using next dev --turbo with the following errors:

./node_modules/.pnpm/@decs+typeschema@0.12.1_ajv@8.12.0_zod@3.22.4/node_modules/@decs/typeschema/dist/index.mjs:109:40
Module not found: Can't resolve '@deepkit/type'
  107 | // src/adapters/deepkit.ts
  108 | var fetchModule2 = /* @__PURE__ */ memoize(async () => {
> 109 |   const { validate: validate2 } = await import(
      |                                         ^^^^^^^
> 110 |     /* webpackIgnore: true */
      | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 111 |     "@deepkit/type"
      | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 112 |   );
      | ^^^^
  113 |   return { validate: validate2 };
  114 | });
  115 | var coerce4 = /* @__NO_SIDE_EFFECTS__ */ (fn) => (schema) => "kind" in schema && !isTypeBoxSchema(schema) && !isJSONSchema(schema) ? fn(schema) : void 0;

https://nextjs.org/docs/messages/module-not-found

The modules that can't be resolved are:

@deepkit/type, @effect/data/Either, @effect/schema/Schema, @effect/schema/TreeFormatter, fp-ts/Either, ow, valibot, yup
TheEdoRan commented 6 months ago

Thank you @AlexisWalravens for opening this issue and @ISnackable for providing additional context. This is a TypeSchema problem, and so I don't know if it's easy to fix. I'll open a new issue on the project's GitHub page, referencing this one.

In the meantime, as a temporary fix, you can use createSafeActionClient() imported from next-safe-action/zod to create safe action clients that work the same way as v5, so you're required to use Zod schemas this way, but actions will work on the edge and with Turbopack. Please let me know if you experience any problems using this.

I'll keep this issue open until the TypeSchema problem is fixed.

AlexisWalravens commented 6 months ago

@TheEdoRan Thanks, will use the workaround until it's fixed ! I was using zod anyway since I came from v5.

I will follow up the issue on TypeSchema side as well.

John-Dennehy commented 6 months ago

I'm getting a similar error also using `pnpm dev --turbopack:

./node_modules/.pnpm/@decs+typeschema@0.12.1_zod@3.22.4/node_modules/@decs/typeschema/dist/index.mjs:352:36
Module not found: Can't resolve 'yup'
  350 | // src/adapters/yup.ts
  351 | var fetchModule8 = /* @__PURE__ */ memoize(async () => {
> 352 |   const { ValidationError } = await import(
      |                                     ^^^^^^^
> 353 |     /* webpackIgnore: true */
      | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 354 |     "yup"
      | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 355 |   );
      | ^^^^
  356 |   return { ValidationError };
  357 | });
  358 | var coerce13 = /* @__NO_SIDE_EFFECTS__ */ (fn) => (schema) => "__isYupSchema__" in schema && !isTypeBoxSchema(schema) && !isJSONSchema(schema) ? fn(schema) : void 0;

Assume same workaround as above is to add "/zod" to the import?

EDIT: using import { createSafeActionClient } from "next-safe-action/zod" did indeed fix the issue. Is it worth adding something to installation docs? Added a quick PR just in case: https://github.com/TheEdoRan/next-safe-action/pull/53

decs commented 6 months ago

hey, folks! thanks for reporting this issue, and special thanks to @sexnine for the fix. Turbopack is now supported on v0.12.2. once you update, it should work out-of-the-box.

TheEdoRan commented 6 months ago

Thank you @decs and @sexnine for the fix! I released a new beta version without the /zod import, that can be installed with:

npm i next-safe-action@beta

Turbopack and edge deployments should work as expected now, even with the current published version, if you reinstall the library in your project, since the requirement for the TypeSchema dependency in package.json is ^0.12.1, and the version with the fix is 0.12.2.

Also, @John-Dennehy, thanks for your contribution via the PR! I didn't update the documentation originally and instead pinned this issue because the /zod import is a workaround, and I prefer to avoid confusion whenever possible. If the fix took longer to land, I would definitely have merged your PR, but now everything should work with no issues. If this is the case, and hopefully it is, there's no need to add a note in the docs.

Please everybody let me know if you experience any bugs even with the new TypeSchema version. If everything's ok I'll release the new stable version soon, without the /zod import. Thank you!