Why does Vite use both rollup and ESBuild rather than just ESBuild?

[knpwrs]

Like the title says, I'm just curious why Vite uses Rollup and ESBuild, rather than just use ESBuild for everything?

[onurusluca]

Found this: https://vitejs.dev/guide/api-plugin.html
It may help.

Vite plugins extends Rollup's well-designed plugin interface with a few extra Vite-specific options. As a result, you can write a Vite plugin once and have it work for both dev and build.

[yann-combarnous]

See https://esbuild.github.io/faq/#upcoming-roadmap, bundling is less stable/advanced in esbuild, especially for code splitting.

Esbuild is still used for transpilation and minification in Vite during build, but bundling is left to Rollup. So esbuild is used for part of the build process.

[faroukfaiz10]

https://vitejs.dev/guide/why.html#why-not-bundle-with-esbuild might also provide more insights.

Also pasted verbatim here for a self-contained reference:

Vite's current plugin API isn't compatible with using esbuild as a bundler. In spite of esbuild being faster, Vite's adoption of Rollup's flexible plugin API and infrastructure heavily contributed to its success in the ecosystem. For the time being, we believe that Rollup offers a better performance-vs-flexibility tradeoff.
Rollup has also been working on performance improvements, switching its parser to SWC in v4. And there is an ongoing effort to build a Rust-port of Rollup called Rolldown. Once Rolldown is ready, it could replace both Rollup and esbuild in Vite, improving build performance significantly and removing inconsistencies between development and build. You can watch Evan You's ViteConf 2023 keynote for more details.

[00155837364765867]

How is this an 'answer'?!?

[Brandin-Canterbury]

Except Comcast has better support than Rollup. Went into their discord to ask a question, and saw many other questions asked, but little in the way of answers. sometimes days gone by before they get answered (If they get answered at all, and some that do, get answered with toxic responses). I do not want to use rollup because I've had a ton of issues with it, and can't get any support.

[Diaskhan]

lol ))) when i think esbuild become must have tool and used instead webpack , there will be a our feature. but it comes feature today!

Витаю Друже. (Congratulations friends)

[meleklassoued]

Vite uses different bundlers:
esbuild => dev mode for hot reloads so when you make changes you see the change super fast.
rollup => production mode to magnify a set of files so we get all the bundling characteristics and optimizations.

THE PROBLEM

First and foremost you have different bundlers for these different environments which can make a mismatch behavior between the dev and production environments and you may see your app is not the same when shipping it to production