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.

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

Getting "DYNAMIC_SERVER_USAGE" and Warning: A title element received an array with more than 1 element as children. #4412

Closed
Mr-Bull007 opened this issue Jan 23, 2025 · 1 comment
Labels

Comments

@Mr-Bull007
Copy link

Mr-Bull007 commented Jan 23, 2025

What is the problem?

So, I just created a Blitz app with pages router and React Hook Form. Now, when I run blitz dev. The webpage shows 404 Not found error. While the errors in terminal have been attached herewith.

Paste all your error logs here:

$ blitz dev
Loaded env from H:\drive g\Kitzje_Course_Renewed\eventio\.env.local
Loaded env from H:\drive g\Kitzje_Course_Renewed\eventio\.env
✔ Next.js was successfully patched with a React Suspense fix
✔ Routes manifest was successfully generated
  ▲ Next.js 13.5.6
  - Local:        http://localhost:3000
  - Environments: .env.local, .env

 ✓ Ready in 30.6s
 ○ Compiling / ...
 ✓ Compiled / in 4.1s (338 modules)
[Rendering Suspense fallback...: DYNAMIC_SERVER_USAGE] {
  digest: 'DYNAMIC_SERVER_USAGE'
}
[Rendering Suspense fallback...: DYNAMIC_SERVER_USAGE] {
  digest: 'DYNAMIC_SERVER_USAGE'
}
 ✓ Compiled /404 in 454ms (342 modules)
Warning: A title element received an array with more than 1 element as children. In browsers title Elements can only have Text Nodes as children. If the children being rendered output more than a single text node in aggregate the browser will display markup and comments as text in the title and hydration will likely fail and fall back to client rendering    at title
    at head
    at Head (webpack-internal:///./node_modules/next/dist/pages/_document.js:258:1)
    at html
    at Html (webpack-internal:///./node_modules/next/dist/pages/_document.js:676:132)
    at MyDocument (webpack-internal:///./src/pages/_document.tsx:11:1)
[Rendering Suspense fallback...: DYNAMIC_SERVER_USAGE] {
  digest: 'DYNAMIC_SERVER_USAGE'
}
Warning: A title element received an array with more than 1 element as children. In browsers title Elements can only have Text Nodes as children. If the children being rendered output more than a single text node in aggregate the browser will display markup and comments as text in the title and hydration will likely fail and fall back to client rendering    at title
    at head
    at Head (webpack-internal:///./node_modules/next/dist/pages/_document.js:258:1)
    at html
    at Html (webpack-internal:///./node_modules/next/dist/pages/_document.js:676:132)
    at MyDocument (webpack-internal:///./src/pages/_document.tsx:11:1)

Paste all relevant code snippets here:

Nothing because it is a completely new app.

What are detailed steps to reproduce this?

  1. blitz new eventio

  2. ✔ Pick a new project's language › TypeScript ✔ Pick your new app template › Full - includes DB and auth (Recommended) ✔ Install dependencies? › npm ✔ Pick a form library (you can switch to something else later if you want) › React Hook Form

  3. Now, when I open my project in VS Code and run blitz dev. It is showing the errors that I mentioned above.

Run blitz -v and paste the output here:

$ blitz -v
Blitz version: 2.2.0 (global)
Blitz version: 2.1.3 (local)
Windows 10 | win32-x64 | Node: v18.19.1


 Package manager: npm

  System:
    OS: Windows 10 10.0.19045
    CPU: (8) x64 Intel(R) Core(TM) i5-8250U CPU @ 1.60GHz
    Memory: 1.10 GB / 7.90 GB
  Binaries:
    Node: 18.19.1 - C:\Program Files\nodejs\node.EXE
    Yarn: Not Found
    npm: 10.2.4 - C:\Program Files\nodejs\npm.CMD
  npmPackages:
    @blitzjs/auth: 2.1.3 => 2.1.3
    @blitzjs/next: 2.1.3 => 2.1.3
    @blitzjs/rpc: 2.1.3 => 2.1.3
    @prisma/client: 6.1.0 => 6.1.0
    blitz: 2.1.3 => 2.1.3
    next: 13.5.6 => 13.5.6
    prisma: 6.1.0 => 6.1.0
    react: 18.2.0 => 18.2.0
    react-dom: 18.2.0 => 18.2.0
    typescript: 5.7.3 => 5.7.3

Please include below any other applicable logs and screenshots that show your problem:

I have shared the relevant details in the above given sections.

@Mr-Bull007 Mr-Bull007 added kind/bug Something isn't working status/triage labels Jan 23, 2025
@qoalu
Copy link

qoalu commented Feb 3, 2025

getting the same. Fresh install

 blitz new BlitzDemoAppPagesRouter
✔ Pick your new app template › Pages Router – Full Setup: includes DB and auth
✔ Install dependencies? … yes
✔ Pick a form library (you can switch to something else later if you want) › React Hook Form
Hang tight while we set up your new Blitz app!
Blitz version: 2.2.1 (global)
Blitz version: 2.2.1 (local)
macOS Sequoia | darwin-arm64 | Node: v22.12.0


 Package manager: npm

  System:
    OS: macOS 15.1
    CPU: (12) arm64 Apple M4 Pro
    Memory: 340.75 MB / 24.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.12.0 - ~/.nodenv/versions/22.12.0/bin/node
    Yarn: Not Found
    npm: 10.9.0 - ~/.nodenv/versions/22.12.0/bin/npm
  npmPackages:
    @blitzjs/auth: 2.2.1 => 2.2.1 
    @blitzjs/next: 2.2.1 => 2.2.1 
    @blitzjs/rpc: 2.2.1 => 2.2.1 
    @prisma/client: 6.1.0 => 6.1.0 
    blitz: 2.2.1 => 2.2.1 
    next: 14.2.15 => 14.2.15 
    prisma: 6.1.0 => 6.1.0 
    react: 18.2.0 => 18.2.0 
    react-dom: 18.2.0 => 18.2.0 
    typescript: ^4.8.4 => 4.9.5 

The issue is in const currentUser = useCurrentUser() inside <UserInfo />, getCurrentUser request returns an html 404 not found page from blitz

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants