dev/build silently externalizes some dependencies, leading to runtime errors

[NfNitLoop]

Describe the bug

Vite has some resolver plugins that cause it to "externalize" some dependencies by name. Instead of giving an error at bundle/build time, the dependency is just dropped from the dependency graph.

vite/packages/vite/src/node/plugins/resolve.ts

Lines 239 to 241 in 88ded7f

	// node built-ins.
	// externalize if building for SSR, otherwise redirect to empty module
	if (isBuiltin(id)) {

This leaves you to get runtime errors when things run in the browser.

If Vite had errors (or even warnings) about this, the user could look for other libraries or polyfills to resolve the issue.

Reproduction

NfNitLoop/vite-issue@5150380

System Info

n/a.

Used Package Manager

npm

Logs

When running npm run build && npm run preview:

Uncaught TypeError: Cannot read properties of undefined (reading 'from')
at vendor.93cea733.js:1:1014
at vendor.93cea733.js:1:1703

When running npm run dev:

[vite] connecting...
index.js:12 Uncaught TypeError: Cannot read properties of undefined (reading 'from')
at node_modules/safe-buffer/index.js (index.js:12:12)
at __require (bs58check.js?v=f7e2e0ea:10:50)
at node_modules/hash-base/index.js (index.js:2:14)
at __require (bs58check.js?v=f7e2e0ea:10:50)
at node_modules/md5.js/index.js (index.js:3:16)
at __require (bs58check.js?v=f7e2e0ea:10:50)
at node_modules/create-hash/browser.js (browser.js:3:11)
at __require (bs58check.js?v=f7e2e0ea:10:50)
at node_modules/bs58check/index.js (index.js:3:18)
at __require (bs58check.js?v=f7e2e0ea:10:50)
client.ts:58 [vite] connected.

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[NfNitLoop]

For comparison, if I forget to enable polyfills in SnowPack, it gives me nice errors like this:

[snowpack] node_modules/readable-stream/lib/_stream_readable.js
Module "events" (Node.js built-in) is not available in the browser. Run Snowpack with --polyfill-node to fix.
[snowpack] node_modules/readable-stream/lib/_stream_readable.js
Module "buffer" (Node.js built-in) is not available in the browser. Run Snowpack with --polyfill-node to fix.

[jianqi-jin]

@NfNitLoop I created a PR for this. :), See if it can solve your problem.

[NfNitLoop]

That’s much better!

My personal preference would be an error, that the user could then bypass with some configuration. Like: externalLibs: [ 'buffer' ]

that way you can’t accidentally miss the message.

However, a warning is a definite improvement over being silent! 😊

[NfNitLoop]

And of course, the nicest would be if Vite had a polyfillNode feature like Snowpack. It would make migrations from snowpack to Vite easier. But I think that’s a different ticket. 😊

[jianqi-jin]

This sounds like a big change. It's literally a feature rather than a bug?

[Niputi]

polyfills in vite core will never be a builtin functionality.
better error messages are fine, would especially be good in build mode.
dependencies should be fixed to not include node builtins as they don't exist in the browser and preferably export correct esm version with .mjsas extension

[NfNitLoop]

This sounds like a big change. It's literally a feature rather than a bug?

I agree! That's why I said:

But I think that’s a different ticket. 😊

I'm OK with just adding warning messages.

---

dependencies should be fixed to not include node builtins

In an ideal world, sure. But that's not the current state of npm packages in my experience. There are many old packages that work just fine in the browser if they're given a Buffer implementation, for example. I ran into a few grandchild (grandparent?) dependencies like this in attempting to port a project from SnowPack to Vite.

Anyway, as I said above, adding polyfills is a separate issue. For the scope of this issue, I'm happy with just adding some warnings/errors.

---

I should elaborate:

There are many old packages that work just fine in the browser if they're given a Buffer implementation, for example.

... and they don't have obvious replacements. (Or, the thing I'm depending on, which depends on them, doesn't have an obvious/easy replacement.)

At which point my choice becomes

• take on maintenance/reimplementation of some of my dependencies because they don't work with Vite
• Stick with my previous bundler that works fine with those dependencies
• Become so fed up with JS/npm that I go try Flutter. 😆

[bluwy]

The latest Vite version should have better warnings when using builtin modules in the browser. I believe the improvements came in Vite 3