Use of esbuild plugins

[moltar]

It appears that esbuild does not support plugins in sync mode.

Wondering if there are any potential solutions for bundling websites with SCSS/SASS transpilers?

[mrgrain]

Yes, I have been thinking about plugins as well recently. This construct would need to invoke to async apis, which from my recollection doesn't play nice with cdk. But I will look into it again. More details on this cdk issue.

The other limitation would be the Docker fallback. Not that it would be impossible to implement plugins for it, but it seems like a fair bit of work. Currently I'm inclined to drop the Docker fallback in the next major version.

[moltar]

Yes, async doesn't work with CDK. :(

[mrgrain]

Maybe something like this could be made work: https://dev.to/mamaar/aws-cdk-4249

Although it moves the code build further up the stack. Currently we only build the code when actually needed (i.e. as part of synthesize)

[moltar]

Maybe something like this could be made work: https://dev.to/mamaar/aws-cdk-4249

Although it moves the code build further up the stack. Currently we only build the code when actually needed (i.e. as part of synthesize)

Not liking that solution :) Anything that moves away from CDK-way will just extra-complicate things in the future.

[mrgrain]

Hey @moltar Just wanted to let you know that I have shipped v2.1.0 which includes an escape hatch that can be utilized to support plugins.

See https://github.com/mrgrain/cdk-esbuild/tree/main/examples/esbuild-with-plugins#readme for further details.

[moltar]

Cheers mate!

I've decided to switch to Vite, which uses esbuild under the hood for dev.

I'm working on a Vite CDK construct 😆

[mrgrain]

Oh cool! Let me know when you have something released, always wanted to check out Vite!

[moltar]

Yeah, it's good for frontend stuff. I still use esbuild for Lambdas.

Vite uses esbuild under the hood for dev mode, but for final bundling it uses Rollup.

I'll let you know when I have a release.

[moltar]

Btw, found Vite easier to setup on a mixed project, as create-react keeps messing with tsconfig and there is no way around it. It's too opinionated about it's environment. While Vite gives way more control, and nice features, like a proxy server that you can run in dev mode and point it at your staging API, for example, which then bypasses CORS problems. It's very nice! Recommend check it out.

[mrgrain]

That sounds great! I've more of a backend background, so the stripped down esbuild experience suits me very well. But I've felt the need for more holistic workflows in frontend as well. Nice to to see that esbuild still serves a propose there, even if it's more abstracted.