I'm seeing `✘ TypeError: Illegal invocation: function called with incorrect `this` reference. See ht

I'm seeing

✘ TypeError: Illegal invocation: function called with incorrect

✘ TypeError: Illegal invocation: function called with incorrect

✘ TypeError: Illegal invocation: function called with incorrect

✘ TypeError: Illegal invocation: function called with incorrect this

 reference. See https://developers.cloudflare.com/workers/observability/errors/#illegal-invocation-errors for details.

reference. See https://developers.cloudflare.com/workers/observability/errors/#illegal-invocation-errors for details.

 reference. See https://developers.cloudflare.com/workers/observability/errors/#illegal-invocation-errors for details.

reference. See https://developers.cloudflare.com/workers/observability/errors/#illegal-invocation-errors for details. on

next@15.0.3
@cloudflare/next-on-pages@1.13.6
wrangler@3.91.0

next@15.0.3
@cloudflare/next-on-pages@1.13.6
wrangler@3.91.0

next@15.0.3
@cloudflare/next-on-pages@1.13.6
wrangler@3.91.0

next@15.0.3
@cloudflare/next-on-pages@1.13.6
wrangler@3.91.0

seems to affect Next.js 15 App Router when using Route Handlers – will see if I can create a simple repro or it depends on any specifics of this small pet project. (I had it running with nodejs_compat_v1 so it might as well be that)

points to this https://github.com/vercel/next.js/blob/canary/packages/next/src/server/web/spec-extension/fetch-event.ts#L37-L49
likely introduced in https://github.com/vercel/next.js/pull/71309 which released in 15.0.0-canary => rc => stable

EDIT: yeah a fresh

npm create cloudflare@latest -- my-next-app --framework=next

npm create cloudflare@latest -- my-next-app --framework=next

npm create cloudflare@latest -- my-next-app --framework=next

npm create cloudflare@latest -- my-next-app --framework=next and then running

npx @next/codemod@canary upgrade latest

npx @next/codemod@canary upgrade latest

npx @next/codemod@canary upgrade latest

npx @next/codemod@canary upgrade latest shows the same error, filed https://github.com/cloudflare/next-on-pages/issues/912

EDIT 2: seems also related to

vercel@39.1.2

vercel@39.1.2

vercel@39.1.2

vercel@39.1.2, forcing

vercel@39.1.1

vercel@39.1.1

vercel@39.1.1

vercel@39.1.1 fixes it.

Jjuanferreras I'm seeing `✘ TypeError: Illegal invocation: function called with incorrect `thi...

bun•11/29/24, 5:44 PM

Hi, i recommend switching to remix

Bbun Hi, i recommend switching to remix

juanferrerasOP•11/29/24, 5:53 PM

I don't (or at least, not for just compat reasons alone)!

Next.js has a few things that makes it specifically difficult to run outside of Vercel – but the company I work for runs next-on-pagesnext-on-pages in production with a lot of traffic quite successfully. It's a lot of effort for Cloudflare & co (and the individual contributors like James) to chase the ever-moving goal post, but with a bit of fiddling and pinning dependencies responsively, it runs perfectly.

I think nodejs_compat_v2 + opennext + 3mb free bundle size is on track to make a potentially brighter future for the dev experience specifically (and less issues with the workerd runtime not supporting some dependencies)

neoney•11/29/24, 9:16 PM

does postgres.js work on next on pages already

neoney•11/29/24, 9:16 PM

and hyperdrive

neoney•11/29/24, 9:18 PM

https://github.com/cloudflare/workers-sdk/issues/5555

GitHub

🚀 Feature Request: cloudflare module polyfills for node.js runtime ...

Describe the solution Implement polyfills to allow modules like cloudflare:sockets to be used in dev mode for cloudflare pages projects. Currently, it is only possible to use those projects when ru...

neoney•11/29/24, 9:18 PM

i see

neoney•11/29/24, 9:18 PM

no progress

neoney•11/29/24, 10:58 PM

well- cloudflare:sockets should work in production, but I can't use it in dev. Is there some alternative to it? Like i'd like to be able to just use the raw nodejs modules in dev mode... idk if that's doable though

neoney•11/30/24, 5:15 PM

turns out it is possible to deploy! Just needs tons of patches. https://github.com/andyjy/mre-pg-nextjs-edge

GitHub

GitHub - andyjy/mre-pg-nextjs-edge

Contribute to andyjy/mre-pg-nextjs-edge development by creating an account on GitHub.

neoney•11/30/24, 6:44 PM

managed to get it working both when deployed and in dev mode, needs patching all those pg packages and nextjs as well to allow using

net

net

in dev

Narasimha•12/1/24, 8:42 AM

Hey can some one help me i am getting Illegal Invocation error ,
i can run it locally but it does not work after i deploy it
i am deploying a next js serverless app

Narasimha•12/1/24, 8:45 AM

@Ahmad Awais Can you please help me solve this issue

Narasimha•12/1/24, 12:15 PM

Hey @cb can I get some help ??

cb•12/1/24, 1:24 PM

Sorry. I have nothing to do with this.

Walshy•12/1/24, 1:44 PM

?pings

SuperHelpflare•12/1/24, 1:44 PM

Please do not ping community members for non-moderation reasons. Doing so will not solve your issue faster and will make people less likely to want to help you.

Walshy•12/1/24, 1:44 PM

Read: https://developers.cloudflare.com/workers/observability/errors/#illegal-invocation-errors

Original message was deleted

Isaac McFadyen•12/2/24, 2:44 AM

The 10MiB limit is a hard (architectural) limit currently and can't be increased.

Isaac McFadyen•12/2/24, 2:44 AM

You'll have to reduce your bundle size somehow, or split into multiple projects.

thipperz•12/3/24, 1:33 AM

Hi there, is the next-on-pages adapter fully compatible with Next 15? I want to know if I can safely update. My project is currently running Next 14.2.16

Tthipperz Hi there, is the next-on-pages adapter fully compatible with Next 15? I want to ...

juanferrerasOP•12/3/24, 1:43 PM

I don't know if officially (the CLI from Cloudflare still ships v14 by default) – but as long as you watch for this issue https://github.com/cloudflare/next-on-pages/issues/912 (e.g. temporarily pin down vercelvercel CLI version), I've got a pet project deployed to Pages with next 15.0.3, app router, apis/middleware, etc and it's working great

note if you upgrade to next-on-pages@1.13.6 (https://github.com/cloudflare/next-on-pages/releases/tag/%40cloudflare%2Fnext-on-pages%401.13.6) - you'll need to run the new Node.js compat v2 (you should just update your compatibility date if it's older than Sept 23), see https://developers.cloudflare.com/workers/runtime-apis/nodejs/#nodejs-api-polyfills

NNarasimha Hey can some one help me i am getting Illegal Invocation error , i can run it lo...

juanferrerasOP•12/3/24, 1:47 PM

--
you might be running into this (https://github.com/cloudflare/next-on-pages/issues/912). However, it should also fail locally when you build (e.g. https://github.com/cloudflare/next-on-pages/tree/main/packages/next-on-pages#build-and-preview-your-application-locally), so it could be a different issue. If it's the same, temporarily pinning down the vercelvercel CLI should fix it)

Mahir Altınkaya•12/3/24, 2:06 PM

Hello,

I am using the next-on-pages package from Cloudflare to release my application under CF Pages. Currently, I am encountering the error: "Exceeds maximum edge function size: 4.18 MB / 4 MB" during deployments. I understand that this issue is caused by the EDGE_FUNCTION_SIZE_LIMIT variable in the @vercel-cli package. Is there a solution on the CF side to increase the value of this variable?

Note: I am using bun.lock, and the patcher does not recognize bun.lock.

switz•12/4/24, 3:33 PM

anyone getting

Illegal invocation: function called with incorrect `this` reference

Illegal invocation: function called with incorrect `this` reference

on og image generation?

switz•12/4/24, 3:33 PM

I had it working before updating my compat date

switz•12/4/24, 3:44 PM

pinning vercel to 39.1.1 fixed it

Mritunjay Rai•12/5/24, 2:18 AM

Hi guys, this might be a long shot, but has anyone successfully established a WebSocket connection to a Durable Object through a Nextjs pages application? I am unable to catch the WebSocket connection request in Nextjs. This is required because all the authentication logic, which relies on D1, resides in the pages app.

Jjuanferreras I'm seeing `✘ TypeError: Illegal invocation: function called with incorrect `thi...

James•12/5/24, 11:21 AM

Just a note that Next.js 15 is not officially supported at this time, and Vercel keeps making it more painful as evidenced by breaking changed in the vercel cli for us

R in Tokyo•12/5/24, 1:54 PM

@James We appreciate all your work!

Juul•12/5/24, 2:56 PM

Hi all. I'm curious, is something in the works to make previewing with workerd (npm run pages:build && wrangler pages devnpm run pages:build && wrangler pages dev) similar to running the Next.js dev server in terms of speed? Right now it feels quite cumbersome in comparison to Next with turbopack or Vite because of 15+ second build times. Or is the OpenNext initiative looking to resolve this? By making then runtimes similar when using the Next.js dev server vs deployed on Pages?

Clément•12/5/24, 5:17 PM

Hi, I use next-on-pages, and when I deploy, the libraries that use process.env.CUSTOM_VARprocess.env.CUSTOM_VAR cannot find my

env

env

, even though I added the secrets on Wrangler.

Do you have any idea for a fix?

rdutton•12/6/24, 3:32 AM

I use remix so don't know for sure, but this might help: https://developers.cloudflare.com/pages/framework-guides/nextjs/ssr/bindings/ ?

JJuul Hi all. I'm curious, is something in the works to make previewing with workerd (...

James•12/6/24, 7:37 AM

next-on-pages has a way for you to use the next dev server for local dev - https://github.com/cloudflare/next-on-pages/tree/main/internal-packages/next-dev

As for OpenNext, it would be better to put that question in the OpenNext discord, but it's certainly possible for something similar to be done for that adapter if needed

JJames next-on-pages has a way for you to use the next dev server for local dev - https...

Juul•12/6/24, 10:01 AM

I am using the Next dev server locally a lot and setupDevPlatform setupDevPlatform is definitely helpful there. But sometimes I have to debug an issue due to the subtle differences between runtimes of next devnext dev (Vercel Edge) and wrangler pages devwrangler pages dev (workerd) because the latter is what runs on production. So I'm looking for a faster workflow to do that locally. Is the best option currently to run npx @cloudflare/next-on-pages --watchnpx @cloudflare/next-on-pages --watch, and then re-run wrangler pages devwrangler pages dev on changes to the build assets? I tried the --live-reload--live-reload functionality of wrangler pages devwrangler pages dev in this situation but it did not seem to trigger reloads of the browser page. And when I manually reload the page, it still referencing the JS chunk files from the original build in the page index HTML causing loading errors until I manually restart the Wrangler dev server. I haven't tried Nodemon yet to restart the Wrangler dev server on build changes, so that might be an option. I'm curious how other people are tackling this.

0xCC•12/6/24, 10:03 AM

Any update on nextJS cloudfalre deploy - my build was working well before, but tonight rebuild hit an issue

22:50:27.881    ▲  Its type '() => Promise<JSX.Element>' is not a valid JSX element type.
22:50:27.881    ▲    Type '() => Promise<JSX.Element>' is not assignable to type '(props: any, deprecatedLegacyContext?: any) => ReactNode'.
22:50:27.881    ▲      Type 'Promise<Element>' is not assignable to type 'ReactNode'.

22:50:27.881    ▲  Its type '() => Promise<JSX.Element>' is not a valid JSX element type.
22:50:27.881    ▲    Type '() => Promise<JSX.Element>' is not assignable to type '(props: any, deprecatedLegacyContext?: any) => ReactNode'.
22:50:27.881    ▲      Type 'Promise<Element>' is not assignable to type 'ReactNode'.

Nothing wrong with local build

BBabacar <@729699826740101250> any updates on this? I’ve been experiencing the same issu...

0xCC•12/6/24, 10:37 AM

I saw someone has raised issue here - https://github.com/cloudflare/next-on-pages/issues/914

GitHub

[🐛 Bug]: build error · Issue #914 · cloudflare/next-on-pages

next-on-pages environment related information No response Description it buid is good yesterday, but it is error today, i do nothing of my code this is the error 14:15:26.583 ▲ ./src/app/[lang]/lay...

num•12/6/24, 3:23 PM

thanks for the post i was going insane why it suddenly broke for me without any change in the lockfile or similar

JJuul I am using the Next dev server locally a lot and `setupDevPlatform ` is definite...

James•12/6/24, 5:46 PM

Afraid there isn't a good workflow for that

R in Tokyo•12/7/24, 12:56 AM

@James Thanks for the work you’ve been doing! I posted a feature request based on Next 15 caching mechanism…. https://github.com/cloudflare/next-on-pages/issues/913

Any recommendations for the time being to get cache working with v 15?

GitHub

[⚡ Feature]: Add Next 15.0.3 Fetch cache support. · Issue #913 · c...

Description previously, cache was on by default. let posts:any = await fetch('https://domain.com/posts').then((res) => res.json()) Updated method to opt-in for cache as per NEXTjs's ...

Original message was deleted

bright_parrot_49151•12/7/24, 1:51 AM

num•12/7/24, 9:54 AM

I really don't get it so either vercel is pulling some changed type defs into the pages build only on cloudflare or the build environment is using different typedefs. I also tried to update vercel but it didn't cause the issue we're seeing in the workers build

Clément•12/7/24, 10:40 AM

I have downgraded Vercel and next-on-pages

Clément•12/7/24, 10:41 AM

I had issues at build too

CClément I have downgraded Vercel and next-on-pages

num•12/7/24, 12:51 PM

on which version were you able to build on cf again? The case in that bug issue is that it works just fine locally (even vercel/next on pages build) with frozen lockfile dependencies but breaks on the cf build

Nnum on which version were you able to build on cf again? The case in that bug issue ...

Clément•12/7/24, 12:53 PM

Delete node-modules if you are in bun

"vercel": "37.14.0",

cloudflare/next-on-pages": "1.13.5

num•12/7/24, 1:07 PM

that doesn't seem to change anything. Issue is that i didn't touch any dependencies or code. It just broke the typescript compiling in the vercel build step without any exterior changes. Meaning i also can't reproduce it locally if i run a next-on-pages build Issue seemed to be incorrectly picked pnpm version in the cf build which caused the lockfile to be ignored

00xCC I saw someone has raised issue here - https://github.com/cloudflare/next-on-page...

0xCC•12/8/24, 8:42 AM

Any updateds???@James

00xCC Any updateds???<@94508156243161088>

num•12/8/24, 9:02 AM

have you checked your build log to see if the package manager is correct and your package lock being used?

num•12/8/24, 9:03 AM

e.g. check if something like

Ignoring not compatible lockfile at /opt/buildhome/repo/pnpm-lock.yaml

Ignoring not compatible lockfile at /opt/buildhome/repo/pnpm-lock.yaml

is logged during the install step

I'm seeing `✘ TypeError: Illegal invocation: function called with incorrect `this` reference. See ht

Similar Threads

Similar Threads

Similar Threads