nonzzz / vite-plugin-stylex

an unofficial @stylexjs vite support
MIT License
50 stars 3 forks source link

SSR/NUXT 3 - Styles get removed #1

Open I-NOZex opened 8 months ago

I-NOZex commented 8 months ago

With a NUXT SSR app, only the first component registering a style gets to keep it. For some reason, the second component has its styles removed.

Reproduction: https://stackblitz.com/edit/nuxt-3-vite-stylex-x1dwmq?file=components%2Fbtn1.vue,components%2Fbtn2.vue,app.vue you can notice that the second button shows the red border after loading but quickly loses all styles.

Very likely to be related with the rehydratation

nonzzz commented 8 months ago

Thanks for you feedback i know why reason cause it :) I will fix it as soon as possbile.

I-NOZex commented 8 months ago

Perfect, thanks for your work good sir!

nonzzz commented 8 months ago

@I-NOZex I release a new version try it.

I-NOZex commented 8 months ago

@nonzzz unfortunately it didn't solve the problem https://stackblitz.com/edit/nuxt-3-vite-stylex-x1dwmq?file=components%2Fbtn1.vue,nuxt.config.ts,package.json

nonzzz commented 8 months ago

image It seems to work fine. I think you should try clearing the cache.

I-NOZex commented 8 months ago

I'm sorry but it doesn't. Tried in Firefox and Edge, in private tabs... Even in a new fork: https://stackblitz.com/edit/nuxt-3-vite-stylex-yfqbxt?file=nuxt.config.ts,app.vue imagem

now the styles of the first button are the ones being removed

nonzzz commented 8 months ago

@I-NOZex an off topic, I think it's a bug for vite or vue. When i try to using https://github.com/bluwy/create-vite-extra to create a vue ssr template for vite. I try to remove style block the page will panic or get a white screen.(I don't using stylex).

nonzzz commented 8 months ago

@I-NOZex a friendly ping, I create a new release v0.2.1 to solve this problem.

nonzzz commented 8 months ago

https://stackblitz.com/edit/nuxt-3-vite-stylex-gjtgq2?file=nuxt.config.ts,package.json

I-NOZex commented 7 months ago

Thank you for the heads-up👍 Unfortunately, it doesn't work, now when the project run fails with


[15:48:00]  ERROR  Pre-transform error: Failed to resolve import "./../../../../../virtual:nuxt:/home/projects/nuxt-3-vite-stylex-kpvjqo/.nuxt/app-component" from "node_modules/nuxt/dist/app/components/nuxt-root.vue". Does the file exist?
nonzzz commented 7 months ago

@I-NOZex , I create v0.2.5 in past i ignored that vue compiler will contain filename, if the input includes stylex or etc will trigger the next step it's broken.This patch version switch to es-module-lexer only scan import decl i think this logic can convert all of scenses. Can you have a try?