stylex icon indicating copy to clipboard operation
stylex copied to clipboard

Feat: implement vite plugin

Open nonzzz opened this issue 1 year ago • 9 comments

The PR is for implement a vite plugin. #47

Currently, @HorusGoul has already implemented it. But it can't cover many sences. like css process by vite, #44 and etc.

CheckList

  • [x] Complete plugin.
  • [ ] Add unit test.
  • [x] Add vite-example.

nonzzz avatar Dec 06 '23 13:12 nonzzz

Maybe you can make it draft since unit test is not ready yet. @nonzzz

umutbozdag avatar Dec 06 '23 17:12 umutbozdag

Thanks for this PR! Vite support is one of the most requested features already.

Other than the missing unit tests, I don't think it solves the problem of generating CSS bundles in dev mode?

If we can make frameworks like Qwik and Astro work with this plugin, we should include examples for those as well.

nmn avatar Dec 06 '23 22:12 nmn

Thanks a lot for this effort! I implemented an integration for astro: astro-stylex. Would love to see this land so it can hopefully be made even better .

lilnasy avatar Dec 09 '23 18:12 lilnasy

Great stuff @lilnasy !

nmn avatar Dec 09 '23 19:12 nmn

I worked with a friend from the Qwik.JS team and got a custom Vite plugin working with a Qwik app: https://github.com/nmn/qwik-stylex

This plugin is able to handle generating and injecting CSS during development without runtime injection. With perhaps a few tweaks, this should enable a fairly universal Vite plugin.

nmn avatar Dec 09 '23 22:12 nmn

@nmn I got some error the message is Uncaught SyntaxError: The requested module '/@fs/E:/self/stylex/packages/stylex/lib/stylex-inject.js' does not provide an export named 'default'

I noticed this #163 and my runtimeInjection is false.

nonzzz avatar Dec 19 '23 12:12 nonzzz

The interesting thing is that it works fine in my own repo :)

nonzzz avatar Dec 19 '23 12:12 nonzzz

This is an issue with ESM. Your plugin probably depends on StyleX publishing real ESM. We already have a PR for this, so we can see if rebasing after that PR fixes the issue.

nmn avatar Dec 19 '23 21:12 nmn