As of Webpack 5, aliases and globals provider need to be explicitly configured. If you want to handle node: protocol imports, you need to provide helper plugin.

1// webpack.config.js
2const stdLibBrowser = require('node-stdlib-browser');
3const {
4	NodeProtocolUrlPlugin
5} = require('node-stdlib-browser/helpers/webpack/plugin');
6const webpack = require('webpack');
7
8module.exports = {
9	// ...
10	resolve: {
11		alias: stdLibBrowser
12	},
13	plugins: [
14		new NodeProtocolUrlPlugin(),
15		new webpack.ProvidePlugin({
16			process: stdLibBrowser.process,
17			Buffer: [stdLibBrowser.buffer, 'Buffer']
18		})
19	]
20};

If you’re using ESM config, additional configuration is needed to handle unspecified extensions:

1// webpack.config.js
2module.exports = {
3	// ...
4	module: {
5		rules: [
6			{
7				test: /\.m?js$/,
8				resolve: {
9					fullySpecified: false
10				}
11			}
12		]
13	}
14};

Since many packages expose only CommonJS implementation, you need to apply plugins to handle CommonJS exports. Those packages could have dependencies installed with npm so they need to be properly resolved (taking into account browser-specific implementations).

Some dependencies can have circular dependencies and Rollup will warn you about that. You can ignore these warnings with helper function (reference).

1// rollup.config.js
2const stdLibBrowser = require('node-stdlib-browser');
3const {
4	handleCircularDependancyWarning
5} = require('node-stdlib-browser/helpers/rollup/plugin');
6const { default: resolve } = require('@rollup/plugin-node-resolve');
7const commonjs = require('@rollup/plugin-commonjs');
8const json = require('@rollup/plugin-json');
9const alias = require('@rollup/plugin-alias');
10const inject = require('@rollup/plugin-inject');
11
12module.exports = {
13	// ...
14	plugins: [
15		alias({
16			entries: stdLibBrowser
17		}),
18		resolve({
19			browser: true
20		}),
21		commonjs(),
22		json(),
23		inject({
24			process: stdLibBrowser.process,
25			Buffer: [stdLibBrowser.buffer, 'Buffer']
26		})
27	],
28	onwarn: (warning, rollupWarn) => {
29		handleCircularDependancyWarning(warning, rollupWarn);
30	}
31};

Vite config uses combination of Rollup and esbuild plugins. It’s important to use dynamic import when using CommonJS configuration so ESM version of modules is picked up. This allows Vite bundling to use our mocking implementation and implement heuristics such as proper tree-shaking and dead code removal marking.

1const inject = require('@rollup/plugin-inject');
2
3const esbuildShim = require.resolve('node-stdlib-browser/helpers/esbuild/shim');
4
5module.exports = async () => {
6	const { default: stdLibBrowser } = await import('node-stdlib-browser');
7	return {
8		resolve: {
9			alias: stdLibBrowser
10		},
11		optimizeDeps: {
12			include: ['buffer', 'process']
13		},
14		plugins: [
15			{
16				...inject({
17					global: [esbuildShim, 'global'],
18					process: [esbuildShim, 'process'],
19					Buffer: [esbuildShim, 'Buffer']
20				}),
21				enforce: 'post'
22			}
23		]
24	};
25};

Vite plugins

If you wish to use simpler configuration, you can use one of the available Vite plugins which use this package under the hood:

• https://github.com/sodatea/vite-plugin-node-stdlib-browser
• https://github.com/davidmyersdev/vite-plugin-node-polyfills

Using esbuild requires you to use helper utilities and plugins.

1const path = require('path');
2const esbuild = require('esbuild');
3const plugin = require('node-stdlib-browser/helpers/esbuild/plugin');
4const stdLibBrowser = require('node-stdlib-browser');
5
6(async () => {
7	await esbuild.build({
8		// ...
9		inject: [require.resolve('node-stdlib-browser/helpers/esbuild/shim')],
10		define: {
11			global: 'global',
12			process: 'process',
13			Buffer: 'Buffer'
14		},
15		plugins: [plugin(stdLibBrowser)]
16	});
17})();

Bundling ES modules is currently not supported natively in Browserify, but you can try using esmify or babelify for transforming to CommonJS first.

1const fs = require('fs');
2const path = require('path');
3const browserify = require('browserify');
4const aliasify = require('aliasify');
5const stdLibBrowser = require('node-stdlib-browser');
6
7const b = browserify(
8	[
9		/* ... */
10	],
11	{
12		// ...
13		transform: [[aliasify, { aliases: stdLibBrowser }]],
14		insertGlobalVars: {
15			process: () => {
16				return `require('${stdLibBrowser.process}')`;
17			},
18			Buffer: () => {
19				return `require('${stdLibBrowser.buffer}').Buffer`;
20			}
21		}
22	}
23);