Default breeze ssr + inertia + react + typescript build has 418 and 423 hydrating errors

[maztch]

trafficstars

I found 418 and 423 hydrating errors on my site build so I tested it on a fresh install in order to start adding components and find the issue. But i found the same issue on the default install.

How to reproduce:

Environment:

• PHP 8.3.10
• Node v22.6.0

Create new project (select react, inertia, typescript, ssr):

composer create-project laravel/laravel example-app
cd example-app
php artisan migrate
composer require laravel/breeze --dev
php artisan breeze:install
php artisan migrate
npm install
npm run build
php artisan serve

Open the web page on chrome and you will see the console errors.

[maztch]

Note: the same process without selecting typescript, has no issues.

[maztch]

This is the default package.json file after the install:

{
    "private": true,
    "type": "module",
    "scripts": {
        "dev": "vite",
        "build": "tsc && vite build && vite build --ssr"
    },
    "devDependencies": {
        "@headlessui/react": "^2.0.0",
        "@inertiajs/react": "^1.0.0",
        "@tailwindcss/forms": "^0.5.3",
        "@types/node": "^18.13.0",
        "@types/react": "^18.0.28",
        "@types/react-dom": "^18.0.10",
        "@vitejs/plugin-react": "^4.2.0",
        "autoprefixer": "^10.4.12",
        "axios": "^1.6.4",
        "laravel-vite-plugin": "^1.0",
        "postcss": "^8.4.31",
        "react": "^18.2.0",
        "react-dom": "^18.2.0",
        "tailwindcss": "^3.2.1",
        "typescript": "^5.0.2",
        "vite": "^5.0"
    }
}

[pascalbaljet]

This issue belongs in the Breeze repository as it's very likely something that needs to be resolved there. Unfortunately, I can't transfer this issue to the Breeze repo, so I'm closing it here. Feel free to open an issue or PR in the Breeze repo about this.