vite-plugin-theme-preprocessor and ElementPlus

[naftis]

I'm not sure if this is an issue of the library but I'm having problems when using this with ElementPlus.

Example repository: https://github.com/naftis/element-plus-theming (based on this: https://github.com/element-plus/element-plus-vite-starter) Error: Some CSS variables don't get loaded

How should I configure ElementPlus to work with this library? I load this file in multipleScopeVars: https://github.com/naftis/element-plus-theming/blob/master/src/styles/theme/default.scss with @forward but all of the CSS variables don't load. It seems like every variable changed in @forward seem to get unloaded.

[GitOfZGT]

Thanks for your feedback. I fixed it in @zougt/some-loader-utils v1.3.5,Please reinstall @zougt/vite-plugin-theme-preprocessor.

[naftis]

Hello, example repository: https://github.com/naftis/element-plus-theming For some reason it doesn't work properly when changing the theme here:

The background should go black, and the "Tag 1" has undefined CSS variables 🤔

Thank you very much for help.

[GitOfZGT]

You should use toggleTheme on this way:

To

[naftis]

@GitOfZGT Thank you :) I fixed that.

https://goofy-booth-e1e803.netlify.app/ the element-plus primary color works in the navigation:

There is another issue though, the Button colors don't change to pink:

It seems to add the variables to style -attribute: Do you think this is element-plus issue or vite-plugin-theme-preprocessor issue?

[GitOfZGT]

element-plus issue or vite-plugin-theme-preprocessor issue?

I also found this problem some time ago, that is element-plus did, theme plugin can not change it, see https://github.com/element-plus/element-plus/issues/4263