Questions tagged [nextjs13]
1277 questions
7
votes
1 answer
Warning: You are mounting a new body component when a previous one has not first unmounted
I am trying to create a page with dashboard layout and a page with default Next.js 13 layout.
I have a problem on the dashboard page.
When I go to the addresses in the dashboard, the display of menus, items, etc. is correct, and to check the error,…
saman samadi
- 436
- 2
- 8
- 19
7
votes
2 answers
Next 13 Jest test fails using 'next/headers'
I am using Next.JS 13, and have a component which is using
import { cookies } from 'next/headers';
The simplified component:
import { cookies } from 'next/headers';
function Simple() {
console.log({ cookies });
return…
njk
- 115
- 10
7
votes
1 answer
NextJS 13: How to pass data from middleware to components?
in NextJS 13 with app folder, I need to get data based on url (language from e.g. /en/asdf/ or /de/asdf/) and pass it to components.
I tried using middleware and it seemed to work relatively well using cookies, but there is one big problem - the…
pak
- 71
- 3
6
votes
1 answer
NextJS 13 - How to create a multilingual not-found page using route groups
I'm struggling to get the localized not-found page to work with NextJS 13 (app-dir). I'm following the official guide on internationalization, as well as this solution I have found on GitHub.
The first solution I have tried
[locale]
--…
Fabio Nettis
- 1,150
- 6
- 18
6
votes
1 answer
Set Metadata Dynamically Without Duplicate Requests - NextJS 13
Consider the following server side component that's part of some page (page.js) in the app directory, representing a person:
export default async function Person({ params }) {
const person = await getPerson(params.id);
return (
…
Twisted Tea
- 49
- 11
6
votes
3 answers
Next JS 13 - Remove layout for specific page
Is there a way to remove the base layout for a specific page in NextJS 13 ? I have a general layout for mosts of my views, but some of them require a separated layout, I don't find any solution now.
I've tried to make "groups" of folders with the…
Qunther
- 117
- 1
- 5
6
votes
1 answer
Unable to use aws-amplify with NextJS 13.4 api routes
I have successfully used pages/api routes in previous versions of NextJS to connect to AWS API Gateway. I'm trying to use new app router to do the same thing in app/api/route. But I'm unable to get the aws-amplify libraries working, i.e.
const…
lentyai
- 534
- 1
- 9
- 22
6
votes
1 answer
Shallow router push in Next.js 13 with appDir enabled
In < Next 13 (or with appDir disabled), you could do:
const MyComponent = () => {
const router = useRouter();
const toggleStatic = () => {
if (router.query.static) {
router.push(router.pathname, router.pathname, { shallow: true…
brandonscript
- 68,675
- 32
- 163
- 220
6
votes
3 answers
Next 13 — client and async server component combined: 'Promise' is not a valid JSX element
I was playing with the experimental Next 13 app directory.
As per the documents, a client component can accept a server component, as long as it is as a children prop.
It works, however I do get a type error
'ServerPage' cannot be used as a JSX…
Fer Toasted
- 1,274
- 1
- 11
- 27
6
votes
1 answer
Cannot destructure property 'store' of 'useReduxContext(...)' as it is null
Im using NextJs 13 and redux toolkit.
When i try the npm run build command, i get this error:
Cannot destructure property 'store' of 'useReduxContext(...)' as it is null.
I think this has something to do with useAppSelector, am i getting the state…
Björn
- 203
- 3
- 8
6
votes
2 answers
How do I know if I'm on the client or server component in the code. Nextjs 13 Beta appDir
For example, I have a piece of code to check if I am a client or a server to have the appropriate logic.
For example. I can use isClient to know that I am in client component.
le khanh
- 61
- 1
- 4
5
votes
3 answers
How to use cookies in Client Components in Next.js 13 and read them on initial SSR request when dynamic routing is enabled?
I really can't figure out what Next.js have for plan to make cookies work in client components. The current docs they have for cookies is not compatible with client components.
In server components, you can read and set the cookies using server…
Dennis Persson
- 843
- 7
- 23
5
votes
0 answers
Nextjs 13 app directory taking too much ram on nodejs Javascript Run time around 2.5GB
When i use nextjs 13 app directory my ram usage will be around 2 to 3 GB for just running nextjs project currently i am doing 2 project in nextjs app directory but when i switch to pages directory of nextjs from old project and done one project in…
Shirshak kandel
- 328
- 3
- 7
5
votes
1 answer
Confused about NextJS, whether to use "app"-directory or "pages" and "index.tsx" or "page.tsx"
NextJS is confusing to me. All official examples and many (most, all?) tutorials that I've read including the official documentation are organizing the application with a pages-directory (and, if necessary, an api-directory for backend services).…
delete
- 18,144
- 15
- 48
- 79
5
votes
0 answers
Upgrading to Next.js 13.4.1 throws "connect ECONNREFUSED 127.0.0.1:62596" error when reloading any pages
I have upgraded Next.js to 13.4.1 and everything works fine on the first render, but after reloading which takes quite a long time, it throws the error below.
Error: connect ECONNREFUSED 127.0.0.1:62596
at TCPConnectWrap.afterConnect [as…
Rinon Tendrinomena
- 51
- 2