question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[SSR] Stop resolving externalized dependencies

See original GitHub issue

Describe the bug

AFAICT, Vite should completely ignore externalize SSR dependencies, including:

  • Not trying to resolve the dependency’s module locations
  • ~Not read the dependency’s code at all~ (edit: this seems to be the case ✅ )

E.g. https://github.com/vuetifyjs/vuetify/issues/13936; I don’t see a reason why Vite should try to resolve the module vuetify/lib/components.

Proposal: Vite should completely ignore externalized deps.

cc @GrygrFlzr

@aleclarson Do you know why Vite touches externalized deps?

@patak-js I’m thinking maybe we should cue in Evan about this at some point.

Reproduction

Vuetify repro: https://github.com/brillout/vuetify3-ssr

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:14 (10 by maintainers)

github_iconTop GitHub Comments

3reactions
brilloutcommented, Aug 2, 2021

@benmccann

velteKit projects all have type: "module" by default, but users still can’t use unified. If I force unified to be external I get the message Must use import to load ES Module because Vite changed my import statement to require.

If the user has type: "module", then Vite should certainly not transpile import statements to require. That’s part of the ESM plan I described above.

This means that SveleKit users will be able to use unified (since the user’s code does import statements even after transpilation).

The neat thing here is: Vite doesn’t need to resolve externalized SSR dependencies. Vite just looks at the user’s package.json and if there is a type: "module" then it keeps import statements and otherwise transforms them into require statements. That’s it.

To sum up:

  • Main propsal: Vite doesn’t need to resolve externalized SSR dependencies.
  • ESM proposal: Vite shouldn’t transform import statements to require statements if the user has type: "module".
  • Remove custom resolver propsal #4447: for bundling the entire server-side code with all dependencies, Vite needs to resolve all dependencies. But maybe we can use Node.js’s resolver and remove Vite’s custom resolver (for SSR at least; we may still need it for the browser-side).

I believe these three proposals will solve many (if not most…) SSR problems mentioned in https://github.com/vitejs/vite/discussions/4230.

Let me know if there are doubts/questions, I’m happy to elaborate further.

0reactions
benmccanncommented, Jul 30, 2021

If a Vite user wants to use unified@10 she has to add type: module to her package.json

SvelteKit projects all have type: "module" by default, but users still can’t use unified. If I force unified to be external I get the message Must use import to load ES Module because Vite changed my import statement to require. I know that’s a loading issue and this thread is about resolving, but I guess the point I’m trying to make is that it’s possible that if we change resolving without fixing loading first it’s possible that we’re going to be hitting these loading issues way more often making SSR even more difficult to use. Not trying to be a cold blanket here because I support your plan. Just trying to keep the larger picture in mind and order things appropriately

Read more comments on GitHub >

github_iconTop Results From Across the Web

SSR: Dependency mocking is the answer! - HackerNoon
In the beginning there was a NodeJS. And it was an adaptation of a “client side” language, now capable to work on server....
Read more >
Vue SSR and external dependencies | by Ismayil Khayredinov
I believe this pattern is suitable for a variety of use cases that involve external dependencies that are not SSR-friendly.
Read more >
Server-Side Rendering - Vite
Dependencies are "externalized" from Vite's SSR transform module system by default when running SSR. This speeds up both dev and build. If a...
Read more >
External Dependencies not working in Nav.svelte
for SSR you consider to import like this: import { Carousel, CarouselControl ... solve it by importing from the src folder of the...
Read more >
Scaling Bazel External Dependencies at Wix - Wix Engineering
Dependency Management Challenges Managing external dependencies when ... where artifacts are resolved upon request and end-state depends on ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found