storybook: migrate to 7.X using @storybook/builder-vite

[florian-sanders-cc]

Context

In #856, we tried to migrate to storybook 7.X using the Web storybook builder.

We are blocked because it does not support the autodocs feature yet.

We want to try migrating using the vite builder.

What works

• everything related to storybook works. Most of the changes described in Storybook: migrate to 7.X using Web Storybook Builder #856 also work with the vite builder. It makes sense because most of these changes are related to the fact we are now directly interacting with Storybook and the Vite ecosystem is very close to Rollup so our rollup plugins worked without any modifications for both build and dev.
• I had to change the WDS plugin that handles CEM generation to make it work with vite. Fairly simple, we rely on resolve and load lifecycle hooks as described here: https://vitejs.dev/guide/api-plugin#importing-a-virtual-file. Note that I did not really respect the conventions (imported file should follow this naming convention: virtual:name) because it would also mean using this system for the build which is not really necessary in our case.

What doesn't work

• We cannot serve anything else than storybook. The vite builder is used as a middleware of the storybook CLI which relies on express. The vite builder only handles requests related to the iframe:
  https://github.com/storybookjs/builder-vite/blob/main/packages/builder-vite/index.ts#L27

The Web storybook builder is also used as a middleware (this is the storybook builder way) but it handles all requests:
https://github.com/modernweb-dev/web/blob/master/packages/storybook-builder/src/index.ts#L121

I'm not 100% sure of all of this yet.

As a workaround, we could use another command to run a vite server when we want to serve our demos but it really sucks and it does not even work yet... (it tries to find an entry, goes in the test files and fails to resolve some dependencies 💣).

=> Managed to make it work thanks to the undocumented middleware.js solution (storybookjs/storybook#435).

TODO:

• investigate runtime.js:4 Component not found in custom-elements.json: Doc warning with doc stories.
• fix/test HMR i18n,
• fix oauth for demo-smart,
• clean dependencies,
• move files where they should be.