Skip to content

feat: add @netlify/vite-plugin#444

Draft
serhalp wants to merge 2 commits intovitejs:mainfrom
serhalp:serhalp/add-netlify-vite-plugin
Draft

feat: add @netlify/vite-plugin#444
serhalp wants to merge 2 commits intovitejs:mainfrom
serhalp:serhalp/add-netlify-vite-plugin

Conversation

@serhalp
Copy link
Copy Markdown

@serhalp serhalp commented Mar 5, 2026

👋🏼

Adding https://npmx.dev/package/@netlify/vite-plugin to the ecosystem!

✅ Works locally


I wanted to ideally && test https://npmx.dev/package/@netlify/vite-plugin-tanstack-start as well (it's in the same monorepo) but it runs e2e tests that deploy to Netlify, which requires a Netlify token env var in CI — is that feasible?

@serhalp serhalp changed the title feat: add Netlify vite plugins feat: add Netlify Vite plugins Mar 5, 2026
@serhalp serhalp force-pushed the serhalp/add-netlify-vite-plugin branch from b8acc1d to 4aeb6ed Compare March 5, 2026 20:53
@serhalp serhalp changed the title feat: add Netlify Vite plugins feat: add @netlify/vite-plugin Mar 5, 2026
@serhalp serhalp marked this pull request as ready for review March 5, 2026 20:56
Co-authored-by: Dominik G. <dominik.goepel@gmx.de>
@dominikg
Copy link
Copy Markdown
Collaborator

dominikg commented Mar 10, 2026

ran your test locally and it passed 🥳

3 questions:

Do you need to build all packages for the vite test or is a subset ok?

stdout | src/main.test.ts > Vite 7.0.0 > configureServer > With @vitejs/plugin-react > Returns static files with configured Netlify headers
Installed npm dependencies in fixture                                                                                                                                                                                                                                    

 ✓ src/main.test.ts (45 tests | 3 skipped) 46593ms
   ✓ Vite 5.0.0 > configureServer > does not warn on single plugin instance  478ms
   ✓ Vite 5.0.0 > configureServer > Populates Netlify runtime environment (globals and env vars)  2834ms
   ✓ Vite 5.0.0 > configureServer > Prints a basic message on server start  1182ms
   ✓ Vite 5.0.0 > configureServer > Prints a message listing emulated features on server start  1166ms
   ✓ Vite 5.0.0 > configureServer > Middleware enabled > Returns static files from project dir  1574ms
   ✓ Vite 5.0.0 > configureServer > Middleware enabled > Returns static files with configured Netlify headers  1330ms
   ✓ Vite 5.0.0 > configureServer > Middleware enabled > Respects configured Netlify redirects and rewrites  1318ms
   ✓ Vite 5.0.0 > configureServer > Middleware enabled > Handles Image CDN requests  1731ms
   ✓ Vite 5.0.0 > configureServer > Middleware enabled > Handles edge function requests  1492ms
   ✓ Vite 5.0.0 > configureServer > Middleware enabled > Ignores SPA redirect in dev mode  1303ms
   ✓ Vite 5.0.0 > configureServer > With @vitejs/plugin-react > Returns static files with configured Netlify headers  2834ms
   ✓ Vite 6.0.0 > configureServer > Populates Netlify runtime environment (globals and env vars)  1421ms
   ✓ Vite 6.0.0 > configureServer > Prints a basic message on server start  1187ms
   ✓ Vite 6.0.0 > configureServer > Prints a message listing emulated features on server start  1186ms
   ✓ Vite 6.0.0 > configureServer > Middleware enabled > Returns static files from project dir  1320ms
   ✓ Vite 6.0.0 > configureServer > Middleware enabled > Returns static files with configured Netlify headers  1330ms
   ✓ Vite 6.0.0 > configureServer > Middleware enabled > Respects configured Netlify redirects and rewrites  1329ms
   ✓ Vite 6.0.0 > configureServer > Middleware enabled > Handles Image CDN requests  1562ms
   ✓ Vite 6.0.0 > configureServer > Middleware enabled > Handles edge function requests  1485ms
   ✓ Vite 6.0.0 > configureServer > Middleware enabled > Ignores SPA redirect in dev mode  1425ms
   ✓ Vite 6.0.0 > configureServer > With @vitejs/plugin-react > Returns static files with configured Netlify headers  1959ms
   ✓ Vite 7.0.0 > configureServer > Populates Netlify runtime environment (globals and env vars)  1178ms
   ✓ Vite 7.0.0 > configureServer > Prints a basic message on server start  1185ms
   ✓ Vite 7.0.0 > configureServer > Prints a message listing emulated features on server start  1213ms
   ✓ Vite 7.0.0 > configureServer > Middleware enabled > Returns static files from project dir  1379ms
   ✓ Vite 7.0.0 > configureServer > Middleware enabled > Returns static files with configured Netlify headers  1393ms
   ✓ Vite 7.0.0 > configureServer > Middleware enabled > Respects configured Netlify redirects and rewrites  1352ms
   ✓ Vite 7.0.0 > configureServer > Middleware enabled > Handles Image CDN requests  1746ms
   ✓ Vite 7.0.0 > configureServer > Middleware enabled > Handles edge function requests  1804ms
   ✓ Vite 7.0.0 > configureServer > Middleware enabled > Ignores SPA redirect in dev mode  1370ms
   ✓ Vite 7.0.0 > configureServer > With @vitejs/plugin-react > Returns static files with configured Netlify headers  1967ms

 Test Files  1 passed (1)
      Tests  42 passed | 3 todo (45)
   Start at  13:56:28
   Duration  48.01s (transform 119ms, setup 0ms, collect 1.13s, tests 46.59s, environment 0ms, prepare 86ms)

this reads like you have templates for vite 5-7, is it possible to focus on the latest template only?
How much of this is actually testing vite api? I would have assumed that vite5 template fails spectacularly when using vite8 but it seems to have passed.

@serhalp
Copy link
Copy Markdown
Author

serhalp commented Mar 11, 2026

Do you need to build all packages for the vite test or is a subset ok?

Yes, @netlify/vite-plugin depends on @netlify/dev which depends on all the other packages in the monorepo.

this reads like you have templates for vite 5-7, is it possible to focus on the latest template only?

Hmm. I'm realizing I hadn't actually looked into how vite-ecosystem-ci tests against a specific vite release (you know, the whole point of vite-ecosystem-ci). I see now that it's setting package.json#overrides (or equivalent) in the specified dir. But since our e2e tests are creating projects on the fly in a tmp dir with a generated package.json, those won't get the vite version we're actually trying to test, defeating the whole purpose.

I imagine we need to make a small change in our repo to support this explicitly. Is there an existing pattern I can follow? or should I just check for ECOSYSTEM_CI and if present replace the hardcoded versions array in the table test with... uhh... import.meta.resolve("vite")? or is there a more explicit way to pass or access the version/path?

@dominikg
Copy link
Copy Markdown
Collaborator

storybook is also generating test project i think. But they are using yarn so not sure how applicable it is.

tbh not sure how your tests make it work when the file that defines the vite versions also imports vite statically. Lazily/dynamically importing vite and picking up the correct path from root package.json overrides was my first hunch too.

But maybe you could also switch to vite version as a matrix dimension in tests rather than hardcoding a list in the test itself.

@JReinhold
Copy link
Copy Markdown

In Storybook we essentially copy the resolutions that vite-ecosystem-ci sets out to our generated projects ("sandboxes") and then run yarn install:

https://github.com/storybookjs/storybook/blob/next/scripts/ecosystem-ci/before-test.js#L31-L44

(We have existing resolutions so there's some merging complexity there which might not be relevant to you)

Crucially we do this in the beforeTest vite-ecosystem-ci hook, which runs after things have been set up with build but before tests are executed.

@serhalp
Copy link
Copy Markdown
Author

serhalp commented Mar 11, 2026

🤔 Hmm ok thanks both!

Right, I can't just specifically resolve vite because other deps like rollup/rolldown/etc. might have overrides too...

But just copying overrides won't work either because of

// npm does not allow overriding direct dependencies, force it by updating the blocks themselves
... 🤔

@serhalp serhalp marked this pull request as draft March 24, 2026 17:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants