How to get Next.js app working with Cloudflare Workers - Workers Sites

Viewed 3234

I am struggling to get an SPA working using Next.js with Cloudflare's Workers Sites. I found a index.js and wrangler file in their document (https://flareact.com/docs/getting-started#quickstart) and I am using it but I am getting the browser error - could not find index.html in your content namespace.

import { handleEvent } from "flareact";

/**
 * The DEBUG flag will do two things that help during development:
 * 1. we will skip caching on the edge, which makes it easier to
 *    debug.
 * 2. we will return an error message on exception in your Response rather
 *    than the default 404.html page.
 */
const DEBUG = false;

addEventListener("fetch", (event) => {
  try {
    event.respondWith(
      handleEvent(event, require.context("./pages/", true, /\.(js|jsx|ts|tsx)$/), DEBUG)
    );
  } catch (e) {
    if (DEBUG) {
      return event.respondWith(
        new Response(e.message || e.toString(), {
          status: 500,
        })
      );
    }
    event.respondWith(new Response("Internal Error", { status: 500 }));
  }
});

I am using a standard Next.js app

1 Answers

This is perhaps not the answer you are looking for but Cloudflare Pages is a lot more suited for deploying JAMstack style sites on Cloudflare. They have specific instructions for next.js and I would suggest using this product if you are able to make it work. It has the added benefit of being a lot easier to deploy as well, simply push to a branch on GitHub and CloudFlare will do the rest.

Related