[Bug?]: Latest Vinxi (>= 0.3.11) causes layout shifts in dev
Duplicates
- [X] I have searched the existing issues
Latest version
- [X] I have tested the latest version
Current behavior 😯
If you create a new project using npm init solid@latest, there's a lot of jank on the screen when loading any page on dev (npm run dev). Running perf tools suggests that CSS isn't getting loaded right away.
I found through experimentation that downgrading to [email protected] or earlier fixes the issue. As of writing, npm init solid@latest installs [email protected].
Prod builds (npm run build && npm run start) are unaffected regardless of version.
Expected behavior 🤔
There shouldn't be massive layout shifts on the screen in dev while running the latest Vinxi.
Steps to reproduce 🕹
Steps:
npm init solid@latestnpm run dev- Visit the home page.
Context 🔦
No response
Your environment 🌎
2021 M1 MacBook Pro, macOS Sonoma 14.4.1
Chrome 123.0.6312.87
node v21.7.1
`package.json`
{
"name": "example-with-tailwindcss",
"type": "module",
"scripts": {
"dev": "vinxi dev",
"build": "vinxi build",
"start": "vinxi start"
},
"dependencies": {
"@solidjs/router": "^0.13.1",
"@solidjs/start": "^1.0.0-rc.0",
"autoprefixer": "^10.4.14",
"postcss": "^8.4.26",
"solid-js": "^1.8.16",
"tailwindcss": "^3.3.3",
"vinxi": "^0.3.10"
},
"engines": {
"node": ">=18"
}
}```
can you give example of what css files are not being loaded. In v0.3.11 we added a feature where we didn't scrape node_modules for css files. Maybe this is what changed
app.css from the project directory, I guess. The screen flashes very clearly when you spin up a new instance using the solid cli tool.
The CSS gets loaded, it's just not loaded right away, hence the jank.
Related PR: #1423