Component Duplication Upon Dev Server Reload

[ORO42]

After triggering hot reload from App.jsx 3 times.

After subsequently triggering hot reload from index.jsx once.

1. Created a new project using npx degit solidjs/templates/js my-app
2. npm install
3. npm i @solidjs/router
4. npm run dev
5. In index.jsx import { Route, Router } from '@solidjs/router';
6. In index.jsx render( () =>( // <Router root={App} /> <Router> <Route path="/" component={App} /> <Route path="/projects" component={Projects} /> <Route path="/projects/:id" component={Project} /> </Router> ), root);
7. npm run dev
8. Trigger hot reload via saving VSCode file
9. Observe component duplication every time hot reload triggers

Additional Considerations:

• I do have tailwindcss vite plugin installed npm install tailwindcss @tailwindcss/vite

EDIT Having started a new project without tailwind, the duplication error still happens. It happens only when saving a file other than index.jsx. Saving index.jsx seems to work as expected with no duplication.

Environment:

• Device: MacBook Pro
• Chip: Apple M1 Max
• macOS version: Sequoia 15.3.1
• Chrome version: Version 133.0.6943.128 (Official Build) (arm64)

Dev Deps:

• "vite": "^6.0.0"
• "vite-plugin-solid": "^2.11.6"

Deps:

• "@solidjs/router": "^0.15.3"
• "@tailwindcss/vite": "^4.0.9"
• "solid-js": "^1.9.5"
• "tailwindcss": "^4.0.9"

vite.config.js
`import { defineConfig } from "vite";
import solidPlugin from "vite-plugin-solid";
import tailwindcss from "@tailwindcss/vite";

export default defineConfig({
plugins: [solidPlugin(), tailwindcss()],
server: {
port: 5173,
},
build: {
target: "esnext",
},
});
`

[brenelz]

I believe this is functioning as expected. You are worried about seeing the file multiple times in the devtools?

It doesn't actually duplicate the component on the page you are viewing though right?

[birkskyum]

We'll need a live reproduction of this in i.e. stackblitz to get futher.