Can I silence "Module externalized for browser compatibility" warnings in vite?

Question

I am using various third party npm modules, whose source code I do not control, and which have no alternatives.

When I run npm run build using Vite, I see a few pages of

transforming (556) node_modules/is-stream/index.js[plugin:vite:resolve] Module "crypto" has been externalized for browser compatibility, imported by "myapp/node_modules/@bundlr-network/client/build/common/upload.js". See http://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
transforming (637) node_modules/@portal-payments/solana-wallet-names/node_modules/buffer/index.js[plugin:vite:resolve] Module "crypto" has been externalized for browser compatibility, imported by "myapp/node_modules/@bundlr-network/client/build/common/transaction.js". See http://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
transforming (719) node_modules/semver/functions/satisfies.js[plugin:vite:resolve] Module "crypto" has been externalized for browser compatibility, imported by "myapp/node_modules/arbundles/src/Bundle.js". See http://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] Module "crypto" has been externalized for browser compatibility, imported by "myapp/node_modules/arbundles/src/DataItem.js". See http://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] Module "crypto" has been externalized for browser compatibility, imported by "myapp/node_modules/arbundles/src/deepHash.js". See http://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
transforming (965) node_modules/@ethereumjs/rlp/dist/index.js[plugin:vite:resolve] Module "http" has been externalized for browser compatibility, imported by "myapp/node_modules/micro-ftch/index.js". See http://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.

I understand vite is 'excluding' these modules, and while vite doesn't explicitly state what externalizing means, there is another part of the docs that states:

Dependencies are "externalized" from Vite's SSR transform module system by default when running SSR. This speeds up both dev and build.

Which seems to indicate that the polyfills are not being optimised. Understood.

It's very hard for me to use a different module, make major changes to the upstream third party module, or rewrite the third party module.

I am satisfied that the node polyfills are not being optimised. My problem is rather than otherwise useful build output is drowned in many pages of warnings.

How can I disable the warning?

Answer 1

As the Vite docs mention "it's advised to report the issue to the respective library". So maybe the package author has solved this problem. My crypto-js's version is 4.0.0, when I update it's version to 4.2.0, the console no longer displays warnings!

Answer 2

You can also install a polyfill for node.js modules.

In my case, installing vite-plugin-node-polyfills solved the issue.

# npm
npm install --save-dev vite-plugin-node-polyfills

# pnpm
pnpm install --save-dev vite-plugin-node-polyfills

# yarn
yarn add --dev vite-plugin-node-polyfills

And then in your vite.config file:

import { defineConfig } from 'vite'
import { nodePolyfills } from 'vite-plugin-node-polyfills'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    nodePolyfills(),
  ],
})

By default, the plugin polyfills multiple node modules, but you can include/exclude the modules you do/don't need.

See: All vite-plugin-node-polyfill polyfills (GitHub)