question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Bug]: PrismaClient execution fails on @remix-run/cloudflare-workers

See original GitHub issue

What version of Remix are you using?

1.0.4

Steps to Reproduce

  1. Use create-remix to create a project. Select Cloudflare Workers at that time.
  2. Install and build prisma.
  3. Write new PrismaClient() in the loader or in app/utils/db.server.ts.
  4. Start up miniflare with yarn start.

Expected Behavior

new PrismaClient() should run without problems.

Actual Behavior

$ yarn start
yarn run v1.22.17
$ miniflare --build-command "npm run dev:worker" --watch

> dev:worker
> esbuild --define:process.env.NODE_ENV='"development"' --bundle --sourcemap --outdir=dist ./worker


  dist/worker.js      609.5kb
  dist/worker.js.map  903.5kb

[mf:inf] Build succeeded
true
[mf:err] /Users/myusername/git/remix-tutorial-cloudflare/dist/worker.js:13428
          throw new Error(`PrismaClient is unable to be run in the browser.
          ^

Error: PrismaClient is unable to be run in the browser.
In case this error is unexpected for you, please report it in https://github.com/prisma/prisma/issues
    at new PrismaClient (/Users/myusername/git/remix-tutorial-cloudflare/node_modules/.prisma/client/index-browser.js:153:11)
    at build/index.js (/Users/myusername/git/remix-tutorial-cloudflare/build/index.js:76:21)
    at __require (/Users/myusername/git/remix-tutorial-cloudflare/dist/worker.js:13:46)
    at /Users/myusername/git/remix-tutorial-cloudflare/worker/index.js:3:24
    at /Users/myusername/git/remix-tutorial-cloudflare/dist/worker.js:14682:3
    at Script.runInContext (node:vm:139:12)
    at VMScriptRunner.runAsScript (file:///Users/myusername/git/remix-tutorial-cloudflare/node_modules/@miniflare/runner-vm/src/index.ts:21:12)
    at VMScriptRunner.run (file:///Users/myusername/git/remix-tutorial-cloudflare/node_modules/@miniflare/runner-vm/src/index.ts:71:12)
    at EventTarget.#reload (file:///Users/myusername/git/remix-tutorial-cloudflare/node_modules/@miniflare/core/src/index.ts:437:38)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
  • I have confirmed that this problem does not occur in remix-run/node.
  • I have read the official Prisma documentation. I tried to change the alias, but the build fails.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:12
  • Comments:19 (6 by maintainers)

github_iconTop GitHub Comments

2reactions
millspcommented, Jun 7, 2022

Hey everyone. We have released some changes a few minutes ago in prisma@3.15.0. tl;dr;

  • Instead of PRISMA_CLIENT_ENGINE_TYPE, use prisma generate --data-proxy to enable the Data Proxy
  • import { PrismaClient } from '@prisma/client/edge' for a Workers-compatible Prisma Client
  • Please be aware that .env aren’t bundled into the generated Prisma Client any longer (see docs)
  • You can also remove any package location aliasing from your build scripts
  • Warnings around eval are now also fixed

Thanks everyone, and your feedback is welcome.

2reactions
kettuicommented, Dec 17, 2021

(When I name the script file for esbuild build.js, it fails to build. The reason is not known.)

this is due to the fact that remix compiles the server-side javascript under <root>/build/ and worker.js then references said built files via import * as build from "../build" -> the worker.js ends up importing your build.js file and will obviously not do what’s intended. The quick fix is to either rename the file like you did or change the import to ../build/index

Read more comments on GitHub >

github_iconTop Results From Across the Web

Integrate Remix with Cloudflare Pages - Jacob Paris
If the dev server tries to open the browser, it will throw an error and fail. ... import { createEventHandler } from "@remix-run/cloudflare-workers"....
Read more >
An example of prisma working on cloudflare pages with Remix
Loading the Prisma client is one of these issues, which is why we need to call getClient from worker/index.ts inside the getLoadContext function ......
Read more >
Data Loading - Remix
import { PrismaClient } from "@prisma/client"; const db = new ... For the Cloudflare Workers environment you'll need to do some other ...
Read more >
Getting Error on Cloudflare Worker Failed to execute ...
I had the same issue when trying to use an NPM module on a Cloudflare worker. Indeed, importScripts does not work, but you...
Read more >
Learn from 425 web development courses on egghead
Cloudflare Workers are serverless functions that run at the Edge! ... such as pagination, handling loading and error states, optimistic updates, ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found