Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

"with-react-intl" Not possible to check in Chrome #27870

Closed
masakinihirota opened this issue Aug 9, 2021 · 3 comments · Fixed by #28336
Closed

"with-react-intl" Not possible to check in Chrome #27870

masakinihirota opened this issue Aug 9, 2021 · 3 comments · Fixed by #28336
Labels
bug Issue was opened via the bug report template. examples Issue/PR related to examples

Comments

@masakinihirota
Copy link

What example does this report relate to?

with-react-intl

What version of Next.js are you using?

latest

What version of Node.js are you using?

v14.16.1

What browser are you using?

Chrome

What operating system are you using?

Windows

How are you deploying your application?

LOCAL VSCode terminal >npx create-next-app --example with-react-intl with-react-intl-app

Describe the Bug

This sample doesn't work.
LOCAL
VSCode terminal

npx create-next-app --example with-react-intl with-react-intl-app
cd with-react-intl-app
npm run dev

> @ dev C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl
> cross-env NODE_ICU_DATA=node_modules/full-icu ts-node --project tsconfig.server.json server.ts

info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
warn  - Minimum recommended TypeScript version is v4.3.2, older versions can potentially be incompatible with Next.js. Detected: 4.0.8
error - ./pages/_app.tsx:32:21
Module not found: Can't resolve '../compiled-lang/fr.json'     
  30 |     switch (locale) {
  31 |       case 'fr':
> 32 |         langBundle = import('../compiled-lang/fr.json');     |                     ^
  33 |         break;
  34 |       case 'en-GB':
  35 |         langBundle = import('../compiled-lang/en-GB.json');
> Ready on http://localhost:3000
event - build page: /next/dist/pages/_error
wait  - compiling...
error - ./pages/_app.tsx:32:21
Module not found: Can't resolve '../compiled-lang/fr.json'     
  30 |     switch (locale) {
  31 |       case 'fr':
> 32 |         langBundle = import('../compiled-lang/fr.json');     |                     ^
  33 |         break;
  34 |       case 'en-GB':
  35 |         langBundle = import('../compiled-lang/en-GB.json');
Error: Cannot find module 'C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\.next\server\pages-manifest.json'
Require stack:
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\require.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\load-components.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\api-utils.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\next-server.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\server\next.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\server.ts
    at Function.call (internal/modules/cjs/loader.js:880:15)   
    at Function.mod._resolveFilename (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\build\webpack\require-hook.ts:64:26)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)  
    at require (internal/modules/cjs/helpers.js:88:18)
    at getPagePath (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:30:25)
    at requirePage (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:64:20)
    at loadComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\load-components.ts:77:29)
    at DevServer.findPageComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:1375:34)
    at DevServer.renderErrorToHTML (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:2039:29) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\require.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\load-components.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\server\\next.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\server.ts'
  ]
}
Error: Cannot find module 'C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\.next\server\pages-manifest.json'
Require stack:
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\require.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\load-components.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\api-utils.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\next-server.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\server\next.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\server.ts
    at Function.call (internal/modules/cjs/loader.js:880:15)   
    at Function.mod._resolveFilename (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\build\webpack\require-hook.ts:64:26)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)  
    at require (internal/modules/cjs/helpers.js:88:18)
    at getPagePath (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:30:25)
    at requirePage (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:64:20)
    at loadComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\load-components.ts:77:29)
    at DevServer.findPageComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:1375:34)
    at DevServer.renderErrorToHTML (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:2039:29) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\require.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\load-components.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\server\\next.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\server.ts'
  ]
}
Error: Cannot find module 'C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\.next\server\pages-manifest.json'
Require stack:
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\require.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\load-components.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\api-utils.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\next-server.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\server\next.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\server.ts
    at Function.call (internal/modules/cjs/loader.js:880:15)   
    at Function.mod._resolveFilename (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\build\webpack\require-hook.ts:64:26)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)  
    at require (internal/modules/cjs/helpers.js:88:18)
    at getPagePath (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:30:25)
    at requirePage (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:64:20)
    at loadComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\load-components.ts:77:29)
    at DevServer.findPageComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:1375:34)
    at DevServer.renderErrorToHTML (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:2039:29) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\require.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\load-components.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\server\\next.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\server.ts'
  ]
}
Error: Cannot find module 'C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\.next\server\pages-manifest.json'
Require stack:
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\require.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\load-components.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\api-utils.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\next-server.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\server\next.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\server.ts
    at Function.call (internal/modules/cjs/loader.js:880:15)   
    at Function.mod._resolveFilename (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\build\webpack\require-hook.ts:64:26)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)  
    at require (internal/modules/cjs/helpers.js:88:18)
    at getPagePath (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:30:25)
    at requirePage (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:64:20)
    at loadComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\load-components.ts:77:29)
    at DevServer.findPageComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:1375:34)
    at DevServer.renderErrorToHTML (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:2039:29) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\require.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\load-components.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\server\\next.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\server.ts'
  ]
}
Error: Cannot find module 'C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\.next\server\pages-manifest.json'
Require stack:
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\require.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\load-components.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\api-utils.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\next-server.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\server\next.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\server.ts
    at Function.call (internal/modules/cjs/loader.js:880:15)   
    at Function.mod._resolveFilename (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\build\webpack\require-hook.ts:64:26)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)  
    at require (internal/modules/cjs/helpers.js:88:18)
    at getPagePath (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:30:25)
    at requirePage (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:64:20)
    at loadComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\load-components.ts:77:29)
    at DevServer.findPageComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:1375:34)
    at DevServer.renderErrorToHTML (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:2039:29) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\require.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\load-components.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\server\\next.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\server.ts'
  ]
}
Error: Cannot find module 'C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\.next\server\pages-manifest.json'
Require stack:
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\require.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\load-components.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\api-utils.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\next-server.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\server\next.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\server.ts
    at Function.call (internal/modules/cjs/loader.js:880:15)   
    at Function.mod._resolveFilename (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\build\webpack\require-hook.ts:64:26)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)  
    at require (internal/modules/cjs/helpers.js:88:18)
    at getPagePath (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:30:25)
    at requirePage (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:64:20)
    at loadComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\load-components.ts:77:29)
    at DevServer.findPageComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:1375:34)
    at DevServer.renderErrorToHTML (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:2039:29) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\require.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\load-components.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\server\\next.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\server.ts'
  ]
}
Error: Cannot find module 'C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\.next\server\pages-manifest.json'
Require stack:
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\require.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\load-components.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\api-utils.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\next-server.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\server\next.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\server.ts
    at Function.call (internal/modules/cjs/loader.js:880:15)   
    at Function.mod._resolveFilename (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\build\webpack\require-hook.ts:64:26)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)  
    at require (internal/modules/cjs/helpers.js:88:18)
    at getPagePath (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:30:25)
    at requirePage (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:64:20)
    at loadComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\load-components.ts:77:29)
    at DevServer.findPageComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:1375:34)
    at DevServer.renderErrorToHTML (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:2039:29) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\require.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\load-components.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\server\\next.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\server.ts'
  ]
}
Error: Cannot find module 'C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\.next\server\pages-manifest.json'
Require stack:
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\require.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\load-components.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\api-utils.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\next-server.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\server\next.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\server.ts
    at Function.call (internal/modules/cjs/loader.js:880:15)   
    at Function.mod._resolveFilename (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\build\webpack\require-hook.ts:64:26)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)  
    at require (internal/modules/cjs/helpers.js:88:18)
    at getPagePath (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:30:25)
    at requirePage (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:64:20)
    at loadComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\load-components.ts:77:29)
    at DevServer.findPageComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:1375:34)
    at DevServer.renderErrorToHTML (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:2039:29) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\require.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\load-components.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\server\\next.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\server.ts'
  ]
}
Error: Cannot find module 'C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\.next\server\pages-manifest.json'
Require stack:
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\require.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\load-components.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\api-utils.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\next-server.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\server\next.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\server.ts
    at Function.call (internal/modules/cjs/loader.js:880:15)   
    at Function.mod._resolveFilename (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\build\webpack\require-hook.ts:64:26)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)  
    at require (internal/modules/cjs/helpers.js:88:18)
    at getPagePath (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:30:25)
    at requirePage (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:64:20)
    at loadComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\load-components.ts:77:29)
    at DevServer.findPageComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:1375:34)
    at DevServer.renderErrorToHTML (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:2039:29) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\require.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\load-components.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\server\\next.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\server.ts'
  ]
}
Error: Cannot find module 'C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\.next\server\pages-manifest.json'
Require stack:
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\require.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\load-components.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\api-utils.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\next-server\server\next-server.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\dist\server\next.js
- C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\server.ts
    at Function.call (internal/modules/cjs/loader.js:880:15)   
    at Function.mod._resolveFilename (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\build\webpack\require-hook.ts:64:26)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)  
    at require (internal/modules/cjs/helpers.js:88:18)
    at getPagePath (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:30:25)
    at requirePage (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\require.ts:64:20)
    at loadComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\load-components.ts:77:29)
    at DevServer.findPageComponents (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:1375:34)
    at DevServer.renderErrorToHTML (C:\2021src\nextjs\04Next.js_etc_all\Internationalization\with-react-intl\node_modules\next\next-server\server\next-server.ts:2039:29) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\require.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\load-components.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\api-utils.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\next-server\\server\\next-server.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\node_modules\\next\\dist\\server\\next.js',
    'C:\\2021src\\nextjs\\04Next.js_etc_all\\Internationalization\\with-react-intl\\server.ts'
  ]
}

Expected Behavior

Not possible to check in Chrome
http://localhost:3000

To Reproduce

LOCAL(Windows)
VSCode terminal

npx create-next-app --example with-react-intl with-react-intl-app
cd with-react-intl-app
npm run dev
@masakinihirota masakinihirota added bug Issue was opened via the bug report template. examples Issue/PR related to examples labels Aug 9, 2021
@HaNdTriX
Copy link
Contributor

fyi: I just rewrote the example in #28336

@masakinihirota
Copy link
Author

Thanks.
I tried the following commands
npx create-next-app --example with-react-intl app-npx
#and
yarn create next-app --example with-react-intl app-yarn

The results are
npm install has failed.
yarn create has succeeded.

> npx create-next-app --example with-react-intl app-npx
Creating a new Next.js app in C:\2021src\nextjs\app-npx.

Downloading files for example with-react-intl. This might take a moment.

Installing packages. This might take a couple 
of minutes.

npm WARN ERESOLVE overriding peer dependency
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: react-intl@5.20.9   
npm ERR! Found: typescript@4.0.8
npm ERR! node_modules/typescript
npm ERR!   peerOptional typescript@"^4.2" from @formatjs/intl@1.14.0
npm ERR!   node_modules/react-intl/node_modules/@formatjs/intl
npm ERR!     @formatjs/intl@"1.14.0" from react-intl@5.20.9
npm ERR!     node_modules/react-intl
npm ERR!       react-intl@"^5.6.3" from the root project
npm ERR!
npm ERR! Could not resolve dependency:        
npm ERR! peerOptional typescript@"^4.2" from react-intl@5.20.9
npm ERR! node_modules/react-intl
npm ERR!   react-intl@"^5.6.3" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: typescript@4.3.5
npm ERR! node_modules/typescript
npm ERR!   peerOptional typescript@"^4.2" from react-intl@5.20.9
npm ERR!   node_modules/react-intl
npm ERR!     react-intl@"^5.6.3" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\hi\AppData\Local\npm-cache\eresolve-report.txt for a full report.     

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\hi\AppData\Local\npm-cache\_logs\2021-08-20T17_00_03_934Z-debug.log   

Aborting installation.
  npm install has failed.

Another err.
yarn create next-app --example with-react-intl app-yarn
cd app-yarn
yarn dev

yarn dev
yarn run v1.22.11
$ cross-env NODE_ICU_DATA=node_modules/full-icu ts-node --project tsconfig.server.json server.ts
info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
warn  - Minimum recommended TypeScript version is v4.3.2, older versions can potentially be 
incompatible with Next.js. Detected: 4.0.8    
info  - Using external babel configuration from C:\2021src\nextjs\app-yarn\.babelrc
info  - Using external babel configuration from C:\2021src\nextjs\app-yarn\.babelrc
info  - Using external babel configuration from C:\2021src\nextjs\app-yarn\.babelrc
info  - Using external babel configuration from C:\2021src\nextjs\app-yarn\.babelrc
info  - Using external babel configuration from C:\2021src\nextjs\app-yarn\.babelrc
info  - Using external babel configuration from C:\2021src\nextjs\app-yarn\.babelrc
info  - Using external babel configuration from C:\2021src\nextjs\app-yarn\.babelrc
info  - Using external babel configuration from C:\2021src\nextjs\app-yarn\.babelrc
error - ./pages/_app.tsx:32:21
Module not found: Can't resolve '../compiled-lang/fr.json'
  30 |     switch (locale) {
  31 |       case 'fr':
> 32 |         langBundle = import('../compiled-lang/fr.json');
     |                     ^
  33 |         break;
  34 |       case 'en-GB':
  35 |         langBundle = import('../compiled-lang/en-GB.json');

Import trace for requested module:

https://nextjs.org/docs/messages/module-not-found
> Ready on http://localhost:3000

langBundle = import('../compiled-lang/fr.json');

Change?

compiled-lang -> lang

@HaNdTriX HaNdTriX mentioned this issue Aug 26, 2021
Merged
10 tasks
@kodiakhq kodiakhq bot closed this as completed in #28336 Sep 20, 2021
kodiakhq bot pushed a commit that referenced this issue Sep 20, 2021
@HaNdTriX
Update with-react-intl example (#28336)
6124e7d 
This PR implements Internationalized Routing using formatjs / react-intl.

## Changelog

- Updated formatjs to latest version
- Remove  deprecated babel-react-intl-plugin in favor of babel-formatjs-plugin
- Remove server in favour of Internationalized Routing
- Added linter with formatjs rules
- Refactored JSX
- Added missing types
- Auto run formtjs script via before hooks
- Adjusted readme docs
- Added message descriptions
- Removed default configs



fixes #27870

## Bug

- [x] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [x] Make sure the linting passes
@balazsorban44
Copy link
Member

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

@vercel vercel locked as resolved and limited conversation to collaborators Jan 27, 2022
natew pushed a commit to natew/next.js that referenced this issue Feb 16, 2022
@HaNdTriX @natew
Update with-react-intl example (vercel#28336)
9e1ae00 
This PR implements Internationalized Routing using formatjs / react-intl.

## Changelog

- Updated formatjs to latest version
- Remove  deprecated babel-react-intl-plugin in favor of babel-formatjs-plugin
- Remove server in favour of Internationalized Routing
- Added linter with formatjs rules
- Refactored JSX
- Added missing types
- Auto run formtjs script via before hooks
- Adjusted readme docs
- Added message descriptions
- Removed default configs



fixes vercel#27870

## Bug

- [x] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [x] Make sure the linting passes
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
bug Issue was opened via the bug report template. examples Issue/PR related to examples
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Update with-react-intl example HaNdTriX/next.js
3 participants
@HaNdTriX @masakinihirota @balazsorban44