remix-pwa / monorepo

Remix PWA v4
https://remix-pwa.run
MIT License
121 stars 25 forks source link

`process is not defined` when using `workerAction` #260

Closed arnaudambro closed 1 month ago

arnaudambro commented 1 month ago

when using a workerAction I get the following error

@remix-run_node.js?v=5474f6a7:21192 Uncaught ReferenceError: process is not defined
    at node_modules/util/util.js (@remix-run_node.js?v=5474f6a7:21192:5)
    at __require2 (chunk-N5SXXOWC.js?v=5474f6a7:21:50)
    at node_modules/stream-slice/index.js (@remix-run_node.js?v=5474f6a7:26697:16)
    at __require2 (chunk-N5SXXOWC.js?v=5474f6a7:21:50)
    at node_modules/@remix-run/node/dist/upload/fileUploadHandler.js (@remix-run_node.js?v=5474f6a7:26894:23)
    at __require2 (chunk-N5SXXOWC.js?v=5474f6a7:21:50)
    at node_modules/@remix-run/node/dist/index.js (@remix-run_node.js?v=5474f6a7:27079:29)
    at __require2 (chunk-N5SXXOWC.js?v=5474f6a7:21:50)
    at @remix-run_node.js?v=5474f6a7:27193:16
node_modules/util/util.js @ @remix-run_node.js?v=5474f6a7:21192
__require2 @ chunk-N5SXXOWC.js?v=5474f6a7:21
node_modules/stream-slice/index.js @ @remix-run_node.js?v=5474f6a7:26697
__require2 @ chunk-N5SXXOWC.js?v=5474f6a7:21
node_modules/@remix-run/node/dist/upload/fileUploadHandler.js @ @remix-run_node.js?v=5474f6a7:26894
__require2 @ chunk-N5SXXOWC.js?v=5474f6a7:21
node_modules/@remix-run/node/dist/index.js @ @remix-run_node.js?v=5474f6a7:27079
__require2 @ chunk-N5SXXOWC.js?v=5474f6a7:21
(anonymous) @ @remix-run_node.js?v=5474f6a7:27193
Show 9 more frames
Show lessUnderstand this error
client:614 [vite] connected.

You can reproduce here (if you have a local instance of postgres setup in the env file as POSTGRESQL_ADDON_URI variable) https://github.com/betagouv/zacharie/pull/6/files

ShafSpecs commented 1 month ago

Weird. Does removing it still throw the error? Does a simple worker action also fail:

export async function workerAction({ context }: WorkerActionArgs) {
  const { fetchFromServer } = context;
  await fetchFromServer();
  return null;
}
ShafSpecs commented 1 month ago

Saw someone report this error on the Remix discord:

Hi! Does anybody understand why I would get @remix-run/node errors on the browser? This happens when I use the cookies I created in an action, and if I use a server module it complains that I'm using a Server Module in a Client Module

 @remix-run_node.js?v=7bf788b4:20925 Uncaught ReferenceError: process is not defined
 at ../../node_modules/.pnpm/util@0.12.5/node_modules/util/util.js (@remix-run_node.js?v=7bf788b4:20925:5)
 at __require (chunk-F2AEQYBP.js?v=7bf788b4:12:50)
 at ../../node_modules/.pnpm/stream-slice@0.1.2/node_modules/stream-slice/index.js (@remix-run_node.js?> v=7bf788b4:26476:16)
 at __require (chunk-F2AEQYBP.js?v=7bf788b4:12:50)
 at ../../node_modules/.pnpm/@remix-run+node@2.9.1_typescript@5.5.4/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js (@remix-run_node.js?v=7bf788b4:26673:23)
 at __require (chunk-F2AEQYBP.js?v=7bf788b4:12:50)
 at ../../node_modules/.pnpm/@remix-run+node@2.9.1_typescript@5.5.4/node_modules/@remix-run/node/dist/index.js (@remix-run_node.js?v=7bf788b4:26861:29)
 at __require....

And I think it might be related, would indicate your reproduction as well.

The error source are also very similar

pcattori commented 1 month ago

It looks like you are relying on json from @remix-run/node within your workerAction. Technically, json is client-safe, but the rest of the @remix-run/node package is not client-safe. In production, treeshaking might remove the rest of the @remix-run/node pkg, but in dev you'll definitely be pulling in the entirety of @remix-run/node into the client which may cause these errors.

This is actually something that will improve in React Router v7, where json will ultimately come from a fully client-safe package.

ShafSpecs commented 1 month ago

Remix PWA ships its own json utility for now to get around this issue. As Pedro mentioned, React Router v7 would fix this issue meaning you won't need to import 2 different json methods when it ships

From Remix PWA docs:

This hook is a re-export of React Router json utility. It works the same way, but isn't exported from the server runtime package (node/cloudflare/deno), allowing it to run in the browser.

arnaudambro commented 1 month ago

then we can close I think

unfortunately I went for another solution so I can't test anymore

thanks !