next.js
next.js copied to clipboard
Next 13 beta RCC fetch with useEffect not working with public directory
Verify canary release
- [X] I verified that the issue exists in the latest Next.js canary release
Provide environment information
Operating System:
Platform: darwin
Arch: x64
Version: Darwin Kernel Version 22.1.0: Sun Oct 9 20:14:54 PDT 2022; root:xnu-8792.41.9~2/RELEASE_X86_64
Binaries:
Node: 19.0.0
npm: 8.19.2
Yarn: N/A
pnpm: N/A
Relevant packages:
next: 13.0.3-canary.3
eslint-config-next: 13.0.2
react: 18.2.0
react-dom: 18.2.0
What browser are you using? (if relevant)
No response
How are you deploying your application? (if relevant)
next export
Describe the Bug
I am using Next 13 beta with the app API (no pages routes) and I am hoping to build a component which pulls text from a TXT file in the public directory into its children. Here's the code:
'use client';
import Link from 'next/link';
import { useEffect, useState } from 'react';
export default function About() {
const [text, setText] = useState('');
useEffect(() => {
void async function () {
const response = await fetch('/rcc-useEffect-test.txt');
const text = await response.text();
setText(text);
}()
}, []);
return (
<>
<header>
<Link href="">« Home</Link>
</header>
{text}
</>
);
}
Unfortunately I am getting this error when I run next build && next export:
PageNotFoundError: Cannot find module for page: /rcc-useEffect-test
I am guessing next export is not fully upgraded to handle the app Next API yet?
Expected Behavior
I would expect Next to build and bundle the application for static file server (such as GitHub Pages) deployment.
Link to reproduction - Issues with a link to complete (but minimal) reproduction code will be addressed faster
https://github.com/TomasHubelbauer/next-13-ssg
To Reproduce
npm install
npm run build
Note that build is patched to be next build && next export so the error should come up.
Note, this issue is also happening when SSGing RSC route. See #42760 for details. In that case, the issue behaves a bit differently in that instead of the route path being reported as the issue, the main route / landing page path is actually being reported as problematic.