Questions tagged [next.js13]
339 questions
16
votes
8 answers
Uncaught Error: invariant expected app router to be mounted
I've got an error while do migration to next 13 on my old project written in next 12.
Console Error Log
I can't find fault in my code for that errors.
And I googled it but i can't find any solution for this.
It don't explains any errors for my…

Evans Benedict
- 276
- 1
- 1
- 7
15
votes
2 answers
Next.js 13 - Fetch Failed Error. How do I resolve this?
I was trying the Next 13 beta version, and I faced a strange problem. What I am trying to do is, fetch data on the server side and display them on the page. However, the "fetch" operation fails on the server side. Below is the code for the Next.js…

Berk Cohadar
- 151
- 1
- 5
8
votes
2 answers
Next.js 13 "window is not defined"
I wrote a component that looks like this:
'use client'
export const HorizontalModule = (props: any) => {
...
return (
{scrollPosition >= 0 && (
)}
{scrollPosition >=…

H3lltronik
- 562
- 8
- 26
7
votes
4 answers
Next 13.4 where is the api Folder?
I have a question regarding Next 13.4. Since today I can only use Next 13.4. I wonder where the api folder has gone. It is no longer created in this version. It still worked in 13.3. How can I now make a POST or GET request and the result with…

Captai-N
- 1,124
- 3
- 15
- 26
7
votes
6 answers
Module not found: Can't resolve '@swc/helpers/src/_class_private_field_init.mjs' using NextUI with Next.js 13
I´m trying to use NextUI with the latest version of Next.js 13. Following the official documentation of NextUI I have followed these steps:
Install NextUI for Next.js
npm i @nextui-org/react
2.Go to pages/_app.js and add this:
// 1. import…

Alejandro Roldán Pérez
- 71
- 1
- 2
7
votes
1 answer
How to provide context to React Server Components (Next.js 13.2) ? (e.g. theme)
I’ve been playing with React Server Components for nearly 2 weeks now and this question has been making my brain hurt: how do you provide context to server components? Like for example, providing a theme (e.g dark | light mode) ? Ive checked the…

Jack Oats
- 71
- 4
7
votes
2 answers
How to pipe to Next.js 13 api response?
Earlier, I was able to pipe the response of another api call to Next.js api response as follows
export default async function (req, res) {
// prevent same site/ obfuscate original API
// some logic here
fetch(req.body.url).then(r => {
…

Mayank Kumar Chaudhari
- 16,027
- 10
- 55
- 122
7
votes
7 answers
Error: Invalid with child after updating to Next.js 13
After updating Next.js to version 13, I got this client error
Contact

Chukwuemeka Maduekwe
- 6,687
- 5
- 44
- 67
6
votes
0 answers
Getting uncaughtException: Error: Cannot find module '...\.next\server\app\home\lib\worker.js' when trying to use pino.transport in Next.js
I have created a Next.js project with typescript using create-next-app. For logging of this particular project I have decided to use Pino logging library as it is recommended by Next.js itself.
When I am using Pino without its transport…

user22177053
- 61
- 1
6
votes
2 answers
Why internationalization is not working on NextJS 13 using a [locale] sub-folder on app/
How to get i18n working on Next 13 ?
I have created a nested [locale]/ folder in app/ but it just gives a 404
See my next.config.js
const nextConfig = {
experimental: {
appDir: true,
},
i18n: {
defaultLocale: 'fr,
locales: ['fr',…

crg
- 4,284
- 2
- 29
- 57
5
votes
0 answers
How to prevent focus to the browser window on error when developing with Next.JS?
When developing with Next.JS, if the app throws an exception, you're redirected to the browser window rendering the error overlay.
Can this behavior be changed?
It can get quite annoying sometimes if you're doing multi-files editing, you're typing…

Aymeric Wilke
- 136
- 7
5
votes
2 answers
Load different css files based on environment with NextJS
I'm building a frontend app using NextJS v.13 and this will be a generic frontend codebase that will be used by multiple sites.
I want to have:
button.site1.css
button.site2.css
And when I build the codebase for site1 I want to somehow tell the…

Weblurk
- 6,562
- 18
- 64
- 120
4
votes
3 answers
Page refresh not working from within component
I have a protected dashboard page that contains a list of reviews. When a new review is added, I want to refresh the page. However, this does not work. Specifically, useRouter().refresh does nothing. I have an AddReview component that is displayed…

lost_in_the_source
- 10,998
- 9
- 46
- 75
4
votes
1 answer
How to handle error response in Next.js 13 Server Component?
So I'm trying to fetch data that needs token header for authorization in Server Component page.tsx. The data itself comes from external backend/API and it can response with different status code. If Unauthorized it will response with status 401, if…

gidgud
- 71
- 1
- 6
4
votes
1 answer
How do I pass data from server component to client component in Next.js 13 app router?
How to pass data from the server component to the client component in Next.js 13 app router?
I am calling an external API in page.tsx which gives the city of the person. I want to pass this city to the client component where this city can be…

Vishal Pawar
- 43
- 1
- 5