How do I use plugins

[marutypes]

Hi!

At Shopify we're trying out implementing SWC in our jest tests (and likely later our build process) as an optimization over babel. Unfortunately, there are some home grown babel plugins we use that we will need to replace.

I noticed there is a plugin section in the docs about how to make custom transforms, which I was hoping I could take advantage of. Unfortunately, I can't actually find an example of how to use these plugins (whether in the .swcrc or in the inline config for jest).

I'd appreciate any guidance on this, or a link if I just missed a doc page 😅

Thanks!

edit Trawling through github I've found some references to a plugin field on the config object when using SWC from js, but none in an .swcrc file. I'm not sure how one would use this in .swcrc but I will try it out in inlined jest config for now and see if it works there. Any guidance would still be super appreciated, and I'd be down to PR the docs with it later if that is something I can do to help.

[kdy1]

Currently, there's no good plugin system.
I'm going to provide a rust plugin API, but it still requires some decisions.

I think the js plugin is not a good fit for swc, and I'm going to remove js plugin api in v2.
(I added it, but I faced some restrictions and I think I should remove it.)

Currently, many users depend on swc from rust side and build their own binaries, including wasm target. From rust-side PoV, swc is quite modular and I can help you if you are going to do so.

[kdy1]

Thanks! I actually need personal opinions from someone who worked on rust transforms :)
I was curious about it because js plugin is almost bare metal.

It would be great if swc supports babel plugin as a fallback (so people migrate one babel plugin at a time), but it would require lots of work.

[kwonoj]

Yes, I noticed that too js plugin support is nearly on your own. If I can share my personal 5c, that'd be enough as long as core swc accept js side manipulations. It'd be better if existing plugin from babel works out of the box - but I'd consider that's more of userland implementation, not the responsibility of the core swc as it exponentially grows scope of the project.

[marutypes]

At now, is implementing a swc plugin in js easier than implementing it as a rust transform? If so, I'll preserve js plugin api, to allow user porting one plugin at a time.
I thought it would be easier to implement a transform in rust because there are lots of helpers, but I'm too familiar with rust and swc to make fair decision.

As someone far more familiar with JS/TS and it's ecosystem than rustlang, I was able to get a basic plugin working in JS in a couple hours but I've most of this week trying to level up my rust skills to be able to get the custom binary path working at all.

I'm still interested in going down that path since performance is our main motivation, but its definitely way harder for someone used to the JS ecosystem.

(The CI / distribution is also much more daunting for an org/dev that has established patterns for JS)

[btoaelbore]

@kdy1 in our in-house build we are using swc plugin in javascript its easy for me because im most familiar with javascript

[joshcartme]

https://github.com/vercel/next.js/tree/706547e0c3cdfcaf0e7c744aba9406642918aeb7/packages/next/build/swc

For next.js, we ported one plugin at a time, and we tested those transforms using a test system of swc_ecma_transforms_testing.

@kdy1 assuming I've created plugins the way it's done with next.js above, how do I use that with swc-loader. swc-loader uses swc/cores transform and transformSync but I'd of course want to use my own. Do I create my own loader as well?

Thanks!

[kwonoj]

It took long, but let me mark this as answered via #3540 and would like to suggest to try out new plugin interfaces. There are rough edges still, hope to get some feedback to improve it.