How to recreate this configuration using Vite?

[WikKam]

Hi! The case study is really insightful and I would love to see similar approach in Vite in action, however, I have not enough time and knowledge to create such config by myself. Is there any chance that some of you might include vite version of this repo? Maybe other build tools would also be beneficial?

[theninthsky]

@WikKam Thanks for your interest in this project!

Unfortunately, I have no knowledge of Vite nor other bundlers and I doubt that any of them is as configurable as Webpack is.

However, if it's dev server speed that concerns you, you can immensely improve Webpack's dev server performance by adding the following lines to the configuration:

cache: { type: 'filesystem' },
experiments: { lazyCompilation: !production },

It seems that doing so allows Webpack to even surpasses Vite in terms of performance:
https://storybook.js.org/blog/storybook-performance-from-webpack-to-vite/#development-cold-start

Nevertheless, I will keep this issue open in hope that someday someone will be able to configure most (if not all) of this project in Vite.

Edit:
I attempted to port this project to Vite and found out that while Rollup has some solid configuration options, it doesn't seem to have the ability to access the compilation object in its HTML plugin, like we do in Webpack:

 new HtmlPlugin({
    scriptLoading: 'module',
    templateContent: ({ compilation }) => {...}
})

Since almost all of this project's optimizations rely on this ability, it's not possible to port to Vite at the moment.

Rspack is also missing a feature that is crucial for us:
web-infra-dev/rspack#6078