evanw / esbuild

An extremely fast bundler for the web
https://esbuild.github.io/
MIT License
38.14k stars 1.15k forks source link

Plugin API which handles the output of another plugin #729

Open deanc opened 3 years ago

deanc commented 3 years ago

Could someone point me in the direction on how to handle the output of another plugin. Use-case here is I want to be able to determine if the SASS plugin has taken a scss import and outputted a css file, and then run it through postcss in my own plugin.

hum-n commented 3 years ago

Hey, esbuild doesn't support that at the moment. I created esbuild-plugin-pipe for that use case. The caveat is, the plugins have to support piping.

deanc commented 3 years ago

Ah okay, early days then. I published a basic PostCSS plugin yesterday, but also saw you have one: https://github.com/nativew/esbuild-plugin-postcss-literal

Nice!

I think ideally this kind of piping, if necessary to achieve this should be supported out the box. So I'll hold off suggesting the sass author add support for it. I would say there is a strong use case for this piping in a few other flows too.

deanc commented 3 years ago

@evanw sorry to tag, just wondering what your opinion is on allowing this kind of piping in the core of esbuild?

As of now if you want to do any kind of multi-step transpiling of CSS or any other imported asset, it's a bit of a mess. I would suggest that the majority of projects are likely to be using something like SASS or LESS and usually that ends with running it through postcss too to do other transforms like autoprefixer.

The only solution I can see for my use-case without using the pipe plugin (which currently requires plugin authors to specifically support that) is to create one hyper-specific plugin which does everything in one go.