search

nonzzz / vite-plugin-stylex

an unofficial @stylexjs vite support
MIT License
47 stars 4 forks source link

LightningCSS does not work in dev mode (HMR) #14

Closed predaytor closed 2 months ago

predaytor commented 2 months ago

Stackblitz (https://stackblitz.com/edit/remix-run-remix-3gnvyb?file=app%2Froutes%2F_index.tsx)

Post-processing with LightningCSS does not work in dev mode on HMR updates. The production build works as expected.

const styles = stylex.create({
  x: {    
     color: 'lch(from pink calc(l + 10%) c h)',  
  },
});

css output:

color: lch(from pink calc(l + 10%) c h);

should be:

color: lch(from pink calc(l + 10%) c h);
color: lab(93.7873% 24.4367 3.75943);

Notice the defined CSS in the regular imported stylesheet (in our case the main import /styles/index.css), the post-processing is working properly.

nonzzz commented 2 months ago

I might think is a bug for lightningCSS. According lch I think expression calc(1 + 10%) not correct syntax. But lightningCSS can make it work well. These are all digressions.

It's a bug for the plugin. I have been fixed this issue in my local. But i need to ensure all of scene can be passed.

nonzzz commented 2 months ago

All related issues will be work at fix