Upgrade to vite 3

[nvh95]

Goal

• Upgrade to Vite 3. Vite team just announce Vite 3.0.0 (https://vitejs.dev/blog/announcing-vite3)

How to test

• We need to test on Vercel preview page manually
• We need to have some e2e tests here. Since integration tests only test the code at JSDOM level. It cannot test if our build process.

Caveats

• vite-plugin-checker@0.4.6 require vite@2. Version 0.4.9 (fi3ework/vite-plugin-checker@cd1f06f) resolves it.

Pending

• Some issues with npm ci in GitHub Actions

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
bestofjs	✅ Ready (Inspect)	Visit Preview	Jul 30, 2022 at 3:44AM (UTC)

[nvh95]

@michaelrambeau
FYI Our integration tests with Jest cannot cover updates like this. So in the future, we need some end-to-end tests to cover some golden flows like #147

[michaelrambeau]

Thank you Hung @nvh95 for the update!

You like to live on "the bleeding edge", this is cool 😄

I checked the preview URL https://bestofjs-git-vite3-bestofjs.vercel.app/ and I noticed that fonts are not downloaded correctly.

We have errors like this:

downloadable font: rejected by sanitizer (font-family: "Open Sans" style:normal weight:400 stretch:100 src index:1) source: https://bestofjs-git-vite3-bestofjs.vercel.app/__VITE_PUBLIC_ASSET__03d6a1cf__

Oddly it works in local.

The good news is that the bundle size didn't increase: 174.53 kB

[nvh95]

@michaelrambeau It's actually a bug and being tracked here vitejs/vite#9174

[nvh95]

I commit a workaround (vitejs/vite#9174 (comment)) to solve the font issue.
But I think we can wait utill Vite fixes this problem.

[nvh95]

@michaelrambeau The font issue has been fixed in vite 3.0.4. Can you help to check it again? Thanks

[michaelrambeau]

👍 Fonts are now displayed correctly.

Thank you very much Hung for your investigation, contribution to Vite project and upgrade of Best of JS, you are the best 😄 !