Wulflok Posts - Answer Overflow

Wulflok

•Created by Wulflok on 3/31/2024 in #pages-help

.vercelignore file?

I have published many sites on Pages using the next-on-pages tool. In the past, my projects only contained the Next.js app and nothing else. This week, I'm trying to set up a site that includes the Next.js app but also a Sanity.io studio install. The project can be used to build the Next.js project and run Sanity Studio for authors.
Sanity Studio keeps a set of key schema files in a directory called schema. This directory is not needed for building the Next.js project and can/should be ignored by Next.js or next-on-pages activity. The problem: Running npx @cloudflare/next-on-pages@1 results in a type error for the Sanity schema that blocks the build. Attempted (and failed) fixes: * Hide the folder with the offending files by renaming /schema to /.schema. * Add a .vercelignore file with schema as the lone entry. * Add schema to the tsconfig.json file in the project to exclude the directory from type checking. * Added schema to the .gitignore as a test (this won't be acceptable as a solution) but that also failed. * Experimented with wrangler.toml to see if there's a way to do it there, but I don't think that runs on prod builds anyhow so..../shrug * Tried all of the above at the same time, just in case...but no joy. How can I tell next-on-pages to ignore a set of files or directories on build?

8 replies

CDCloudflare Developers

•Created by Wulflok on 6/21/2023 in #pages-help

Report build status on completion?

As we're working to get our sites set up, one thing we are thinking thru is how to let the team know a build ran (or failed). We expect most builds to be done automatically via webhooks or a github merge, so automating the build reporting is as important as web stats to be sure we know updates are working. Are there any examples or docs that discuss: 1. is this better done in the app/project itself, so the build command might be npx @cloudflare/next-on-pages && npm run alert where alert would be a script we create to send some build details/status? (Downside: that adds to build time and also worry if that fails/throws that an otherwise good build might "fail" on an alert.) 2. can we 1-time-call a worker to send status to an API helping us monitor builds, uptime stats from 3rd parties, etc? 3. we didn't see in docs or the admin screens any hints for sending status or reporting, but maybe we missed it? The main thing here we want to guard against: (a) our CMS being temporarily unavailable, causing a build to fail or (b) the CMS or other dependency is slow, causing a time-out on build. I'd guess somebody has solved this problem, so we're happy to hear any stories about how people monitor this to ensure builds aren't failing over and over until somebody on a writing team/using a headless CMS yells "where's my stuff?!?!?!". 🙂

6 replies

CDCloudflare Developers

•Created by Wulflok on 6/14/2023 in #pages-help

Nextjs, next-on-pages, "hanging Promise was canceled"

Hi all, I'm trying to build a statically rendered site on Pages using Next. I have a dynamic route as follows: /app/(content)/articles/[slug] that will render content pulled from a headless CMS. When I use npm run dev with Next, these routes work fine. but when I build the site with npx @cloudflare/next-on-pages@1 and then use wrangler to do a preview, it works for other non-dynamic pages but throws on the [slug] with:

A hanging Promise was canceled. This happens when the worker runtime is waiting for a Promise from JavaScript to resolve, but has detected that the Promise cannot possibly ever resolve because all code and events related to the Promise's I/O context have already finished.

✘ [ERROR] Uncaught (in response) Error: The script will never generate a response. I've been trying to reduce to solve, and removed everything I can imagine so that I've literally got this as my page.js for the [slug] route:

export const runtime = 'edge';

export async function generateStaticParams() {
  return [{ slug: 'article-one'}, {slug: 'article-two'}];
}

export default async function articlePage() {
   return (
    <div>
      <div>Hello</div>   
    </div>
  )
}

export const runtime = 'edge';

export async function generateStaticParams() {
  return [{ slug: 'article-one'}, {slug: 'article-two'}];
}

export default async function articlePage() {
   return (
    <div>
      <div>Hello</div>   
    </div>
  )
}

Even that generates the hanging Promise error, which....I dont' get. I suspect I'm missing something with how generateStaticParams works with next-on-pages? Or...well, I don't know. That's why I'm here. 🙂 Any ideas on why this page is not working, even when there are no outside calls/async functions (so to speak)?

18 replies

CDCloudflare Developers

•Created by Wulflok on 5/21/2023 in #pages-help

Next 13.4.2, not-found.js, and 404's on Pages

Hi all - I have successfully been publishing pages w/ a Next.js setup for a few months and things are great, except.... With the new appDir setup on Next 13.4.2, I created a not-found.js file to return a custom 404 and not the Next default. On my local setup using npm run dev this works correctly and gives me my custom page. On Pages, it returns the Next default error message and not the custom page.
Given that it works locally, I'm wondering what might be creating this weird behavior. I couldn't find anything searching here or on the Next GitHub issues, so if anybody has seen this I'd appreciate a pointer. Thanks! 🙂

30 replies

Gaming

Programming