Hello, I am still struggling to understand on how to run a next-on-pages dev environment. How do I r

Hello, I am still struggling to understand on how to run a next-on-pages dev environment.
How do I run it like

npx next dev

npx next dev

npx next dev

npx next dev would (with instant updates as I change the code, instead of needing to compile everything all the time).
If I run

wrangler pages dev

wrangler pages dev

it will run an outdated version of what I locally have (which I assume is my last build).
If I run

wrangler dev

wrangler dev

it is asking me to specify an entry point, which I don't now what to put in there for the dev environment.

Matt•5/24/24, 7:42 PM

has anyone had a chance to try next15? curious how it goes, going to give it a shot a lil later hopefully

Bbun but try 14.2.3, it seems to be working

jg•5/24/24, 8:45 PM

thank you for this!

richtera•5/24/24, 10:01 PM

I have a weird build error. I have the .node-version, .tool-versions and mise.yaml config files to tell the builder to build using 20.5.1. I see asdf installing 20.5.1 correctly, but then during the build it all of a sudden says it found 18.17 to build with. My site will not build with 18.x so I can no longer use the cloudflare builder. It works fine building it locally and uploading it using wrangler pages deploy and the function works correctly (ie. SSR using nexjs with a next-on-pages vercel build.)

richtera•5/24/24, 10:02 PM

It will also work using github actions, of course, but then it's the role problem I mentioned in the other channel making this really suboptimal for large enterprises.

HHollo Hello, I am still struggling to understand on how to run a next-on-pages dev env...

Baran•5/25/24, 7:19 AM

develop with next devnext dev. When you are done developing and want to deploy, run

wrangler pages dev

wrangler pages dev

to test the final version before deployment.

By default, the entry point is the build directory, so add the following to your

wrangler.toml

wrangler.toml

pages_build_output_dir = ".vercel/output/static"

pages_build_output_dir = ".vercel/output/static"

Note:

wrangler dev

wrangler dev

runs a worker, but next-on-pages is a

pages

pages

feature (which is a subset of workers). So,

wrangler dev

wrangler dev

will probably not be compatible with next-on-pages, so please use

wrangler pages dev

wrangler pages dev

BBaran develop with `next dev`. When you are done developing and want to deploy, run `w...

HolloOP•5/25/24, 10:39 AM

Thank you for clearing that up!

Nob•5/27/24, 7:43 PM

Hi, there is a problem with fetch request with "force-cache" that are loading forever randomly when its a file bigger than 1Mb in server components

Nob•5/27/24, 7:43 PM

in prod and in dev

Rodrigo•5/28/24, 9:33 PM

Has anyone used next-on-pages with the analytics-engine in development? For me the env binding stay undefined.

Isaac McFadyen•5/28/24, 9:43 PM

^ solved in analytics-engine

in the future please don't cross-post across channels.

dhanasekar•5/29/24, 1:59 AM

Hi, can any one help me out from the Worker error 1101, this error occurs when i use the optional catch-all segments from dynamic routes. wrangler dev log returns -- TypeError
Invalid URL string.

dhanasekar•5/29/24, 2:02 AM

Hi i have used addEventListener in my index pages, still i receive the same worker error 1101. i am sure were to handle the addeventlistener.

zbeyens•5/29/24, 10:17 AM

Hi! I have built a NextJS app fully on Edge and so far it went good. Suddenly I've crossed the bundle size limit Generated Pages Functions bundle size (49446697) is over the limit of 25.0 MiBGenerated Pages Functions bundle size (49446697) is over the limit of 25.0 MiB with empty pages going over 3MB. I'm blocked on this, is there a way to measure / debug / split parts to find the dependency cause? Note that Vercel deploys it successfully without crossing their limit. I'd love to stay on Edge/CF

youflix.7ed3f186-8065-4e32-abbe-d6f61f13db19.log110.65KB

num•5/30/24, 8:51 AM

Does anybody know how to prepare for next 15 fetch changes which don't cache by default anymore?
See https://nextjs.org/blog/next-15-rc#caching-updates

If I try to restore/prepare the old behavior with fetch('myUrl', { cache: 'force-cache' })fetch('myUrl', { cache: 'force-cache' }) the worker throws an error due to https://github.com/cloudflare/workerd/issues/698 .

GitHub

🐛 BUG: The cache field on RequestInitializerDict is not implemented...

Which Cloudflare product(s) does this pertain to? Workers for Platforms What version of Wrangler are you using? Latest What operating system are you using? All Describe the Bug Making a fetch reque...

Next.js 15 RC

The Next.js 15 Release Candidate (RC) is now available. This early version allows you to test the latest features before the upcoming stable release.

num•5/30/24, 8:52 AM

hm maybe i should check if it works if i follow https://github.com/cloudflare/next-on-pages/blob/main/packages/next-on-pages/docs/caching.md

num•5/30/24, 9:30 AM

should this maybe be a linting rule that one could contribute? Feels like a foot gun as it's only happening at runtime on pages/workerd and not during build or local development with next devnext dev

Sej•5/30/24, 9:59 AM

Am I correct in understanding that getRequestContext only works in the App router? And in order to access the bindings in the wrangler.toml file for Pages router, I have to use process.env instead? Any help would be appreciated

cj•5/30/24, 4:40 PM

How can we debug a next js app running

wrangler pages dev

wrangler pages dev

I have a next js app that works perfectly when on node / nextjs, but when I try testing it using

wrangler pages dev

wrangler pages dev

I get the following error

[wrangler:err] TypeError: This ReadableStream is disturbed (has already been read from), and cannot be used as a body.

If I could set break points to debug the app, it would help me figure this out.

cj•5/30/24, 5:00 PM

I tried setting a dev port using

wrangler pages dev --inspector-port 9229

wrangler pages dev --inspector-port 9229

And now see an error occationally

Unused stream created

cj•5/31/24, 8:07 AM

While I was unable to debug using breakpoints I figured out why I was facing This ReadableStream is disturbed (has already been read from)This ReadableStream is disturbed (has already been read from).

And I don't think cf pages support debugging using breakpoints yet

luna•6/1/24, 8:46 AM

is there an ETA to when routeroute will work for pages in the wranger.tomlwranger.toml ? kinda annoying that workers and pages are still seperate..

cj•6/1/24, 10:03 AM

Yes, kinda annoying workers and pages are separate

thipperz•6/2/24, 11:50 PM

What is the difference between deploying with

wrangler pages deploy

wrangler pages deploy

or by pushing a commit to preview branch? Specifically for VARS and stuff, my NEXT_PUBLIC_APP_URL is only working when git pushed

Rishabh•6/3/24, 10:54 AM

@all

Build Failed: build exceeded memory limit and was terminated. (Preview and Prod)

I tried the same by increasing --max-old-space-size=8192 but deployment continued to have the same error as stated.

|14:08:46.399|Success: Finished cloning repository files|
|14:18:58.679|Failed: build exceeded memory limit and was terminated|

Deployment id: 9aff3dcd-9f38-4002-93db-5020409e5a8b
node: 18.17

Would appreciate any help.

Flare•6/3/24, 10:57 AM

Please do not post your question in multiple channels per the rules at No Access. It creates confusion for people trying to help you and doesn't get your issue or question solved any faster.

cj•6/3/24, 5:33 PM

I am trying to set a response header in the middleware and read it in pages or layout routes. But this isn't working.

I have filed a bug report here - #797

Quick summary in the thread

GitHub

[🐛 Bug]: Failed to read header in page / layout after setting it in...

next-on-pages environment related information System: Platform: darwin Arch: arm64 Version: Darwin Kernel Version 23.5.0: Wed May 1 20:14:38 PDT 2024; root:xnu-10063.121.3~5/RELEASE_ARM64_T6020 CPU...

t4•6/4/24, 4:31 AM

Hi, how do I run next devnext dev with edge runtime? When I load up my app on next devnext dev with runtime = "edge"runtime = "edge" it shows a blank screen

Tt4 Hi, how do I run `next dev` with edge runtime? When I load up my app on `next de...

aspecs•6/4/24, 4:40 AM

https://github.com/vercel/next.js/issues/53562

GitHub

error TypeError: Cannot read properties of undefined (reading '') w...

Verify canary release I verified that the issue exists in the latest Next.js canary release Provide environment information Operating System: Platform: win32 Arch: x64 Version: Windows 10 Pro Binar...

Tt4 Hi, how do I run `next dev` with edge runtime? When I load up my app on `next de...

ixixix•6/4/24, 4:44 AM

I just created a new next project with cloudflare cli and added the runtime='edge'runtime='edge' and it works

Aaspecs https://github.com/vercel/next.js/issues/53562

t4•6/4/24, 4:44 AM

I'm on a Mac

t4•6/4/24, 4:45 AM

But just to confirm it's supposed to not break next dev? As in I don't need to switch to Wrangler or something like that

t4•6/4/24, 4:58 AM

I think the issue is something else; it's the env vars

t4•6/4/24, 4:59 AM

how am I supposed to manage environment variables in next devnext dev if in edge runtime mode working with Cloudflare? I don't want to NEXT_PUBLIC_NEXT_PUBLIC_ my github app secrets

Tt4 how am I supposed to manage environment variables in `next dev` if in edge runti...

ixixix•6/4/24, 5:14 AM

Maybe this can help you, it's recommended to use

getRequestContext

getRequestContext

and

.dev.vars

.dev.vars

https://developers.cloudflare.com/pages/framework-guides/nextjs/deploy-a-nextjs-site/#top-level-getrequestcontext

Cloudflare Docs

Full-stack deployment · Cloudflare Pages docs

Deploy a full-stack Next.js site (recommended).

Iixixix Maybe this can help you, it's recommended to use `getRequestContext` and `.dev.v...

t4•6/4/24, 5:15 AM

does this work also outside of route handlers?

t4•6/4/24, 5:16 AM

(i.e. I can replace

process.env

process.env

anywhere in the code with getRequestContext()getRequestContext())

Tt4 does this work also outside of route handlers?

ixixix•6/4/24, 5:17 AM

i think it works locally in dev mode but not in a build

Tt4 (i.e. I can replace `process.env` anywhere in the code with `getRequestContext()...

ixixix•6/4/24, 5:20 AM

as long as you are not using it at the top level, it works anywhere rsc, route handlers, server actions

t4•6/4/24, 5:20 AM

top level being?

t4•6/4/24, 5:20 AM

would it work somewhere like

next.config.js

next.config.js

Tt4 would it work somewhere like `next.config.js`?

ixixix•6/4/24, 5:21 AM

t4•6/4/24, 5:23 AM

I need it to work there so I guess that's a no go

loco•6/4/24, 12:33 PM

How many worker invocation are counted when accessing bindings in next-on-page?
For example, if i visit simple hello world page
that would be 1 invocation
if i visit another page which fetches a row from d1(connected via binding) is that 1 + 1 invocation or a single invocation?