the dev build process that most of front-end developers use: the source code, which is not directly
understandable by browsers,
is compiled and bundled. The main reason for bundling is that browsers do not understand modules formats
used in the source code (cf B.),
so we have to concatenate everything into huge scripts. The pain point here is that, for any modification
done in the source code,
part or all of the application has to be rebuilt, which takes time.
Vite is a development server based on ES modules and a production server based on the bundler Rollup (which
itself relies on ES modules).
Even though Vite has built-in support for Vue apps (this point is being discussed here), Vite is
framework-agnostic and can support other
frameworks with plugins. It currently has working plugins for React, Preact and Svelte. Also, VitePress, a
static site generator based
on Vue and Vite ("VuePress's brother") is currently under development.
In dev mode, Vite supports HMR (Hot Module Replacement) for the frameworks previously mentionned.
Wonderfully, we don't have to mess around with any plugins to get Vite to support SASS.
There's just two steps:
npm install --save-dev sass
in any CSS files where you want to write SASS, change the file extension from `.css` to `.scss`
(and update any references in your HTML or JS files).
This is an important point: excepted for dev dependencies, Vite looks for an ES distribution, or, when it is
not available,
prebundles the dependency into ESM.