Unable to find next-intl locale

[ivanafanasyeu]

Description

 X node_modules/next-intl/dist/esm/server/RequestLocale.js (1:580) @ eval
 X Error: Unable to find `next-intl` locale, have you configured the middleware?`
    at RootLayout (./src/app/[locale]/layout.tsx:33:73)
    at async Promise.all (index 0)
null

version: ^3.0.0-beta.19

Mandatory reproduction URL (CodeSandbox or GitHub repository)

https://github.com/ivanafanasyeu/languages-with-lib

Reproduction description

Steps to reproduce:

1. Do everything as in guide
2. just run npm run dev

Expected behaviour

Working project with no errors in dev mode and build

[manelcomiche]

#446

[ivanafanasyeu]

#446

It's not. 446 marked as answered and merged, While it's repeating in the last version of the package

[manelcomiche]

#446

It's not. 446 marked as answered and merged, While it's repeating in the last version of the package

#446 (comment)

[ivanafanasyeu]

#446

It's not. 446 marked as answered and merged, While it's repeating in the last version of the package

#446 (comment)

Thanks for quick response and trying, but it appears on dev for me. Not production only

[BearCooder]

I have the same problem. I followed the guide (it seems in step 5 const locale = useLocale(); is also missing)
But at the end I just get a 404 This page could not be found on http://localhost:3000/. When I append /en (which is my default locale) then I receive

Unhandled Runtime Error

Error: Unable to find `next-intl` locale, have you configured the middleware?`

I use the latest beta version and next 13.5.2

[amannn]

Steps to reproduce:

1. Do everything as in guide
2. just run npm run dev

For me the app runs fine (Node.js 18).

Can you share more context on which steps are necessary to reproduce the bug?

[ivanafanasyeu]

Steps to reproduce:

1. Do everything as in guide
2. just run npm run dev

For me the app runs fine (Node.js 18).

Can you share more context on which steps are necessary to reproduce the bug?

Sure. Open console, it's a console error after npm run dev

[amannn]

🤦‍♂️, of course—my bad.

The issue is the following:

You have this middleware matcher: /((?!api|_next|.*\\..*).*). After rendering the home page, the browser automatically tries to fetch favicon.ico. This request is not matched by the middleware and there's also no static asset for this request in your app. Due to this, the request is handled by your [locale] route, since it matches everything. In your layout.tsx you call useLocale at the top of the component and this fails since the middleware didn't run on the request.

Last week I've updated the setup step for creating the layout to validate the incoming locale without having to use useLocale: https://next-intl-docs.vercel.app/docs/getting-started/app-router-server-components#applocalelayouttsx

This helps to get rid of the issue in your app.

I'll try to improve the error message for this case, thanks for bringing this up!

[ivanafanasyeu]

🤦‍♂️, of course—my bad.

The issue is the following:

You have this middleware matcher: /((?!api|_next|.*\\..*).*). After rendering the home page, the browser automatically tries to fetch favicon.ico. This request is not matched by the middleware and there's also no static asset for this request in your app. Due to this, the request is handled by your [locale] route, since it matches everything. In your layout.tsx you call useLocale at the top of the component and this fails since the middleware didn't run on the request.

Last week I've updated the setup step for creating the layout to validate the incoming locale without having to use useLocale: https://next-intl-docs.vercel.app/docs/getting-started/app-router-server-components#applocalelayouttsx

This helps to get rid of the issue in your app.

I'll try to improve the error message for this case, thanks for bringing this up!

thank you. Yes, new layout config fixed the console error

[amannn]

Great to hear! I've added a new troubleshooting section here with more context: https://next-intl-docs.vercel.app/docs/routing/middleware#unable-to-find-locale

It will also be linked to from the "Unable to find next-intl locale" message in the next beta release.

Thanks again!

[HarleySalas]

Not sure if I should create an issue for this, but I can't really wrap my head around how importing a css file suddenly causes me to get this error (nothing seems to actually break, though i have not checked the build output), you can see multiple console logs where "en" is indeed received, but also "_next" at some point... The only thing I do is import a .css file from mantine-datatable and suddenly, this error message appears...

 ✓ Compiled in 352ms (1915 modules)
params from test: {"locale":"en"}
locale: en
locale: _next
 ⨯ node_modules\next-intl\dist\esm\server\RequestLocale.js (1:609) @ eval
 ⨯ Error: Unable to find `next-intl` locale because the middleware didn't run on this request. See https://next-intl-docs.vercel.app/docs/routing/middleware#unable-to-find-locale
    at stringify (<anonymous>)
null
 ⨯ node_modules\next-intl\dist\esm\server\RequestLocale.js (1:609) @ eval
 ⨯ Error: Unable to find `next-intl` locale because the middleware didn't run on this request. See https://next-intl-docs.vercel.app/docs/routing/middleware#unable-to-find-locale
    at stringify (<anonymous>)
digest: "2059184074"