Can't import node builtins in a route module

[ryanflorence]

I tried with crypto/fs, both broken. You have to move it to a different file and import from there.

https://discord.com/channels/770287896669978684/771068344320786452/828673055777095720

[mjackson]

esbuild issue: evanw/esbuild#705

[Haroenv]

events also has this issue. I was using a package that uses the npm version of events, but somehow it still resolves to the node builtin in the browser (unless I alias it to something else, but it's hard to do in this case, as it's quite deep in the module tree)

Watching Remix app in development mode...
It appears you're using a module that is built in to node, but you installed it as a dependency which could cause problems. Please remove events before continuing.
💿 Built in 10ms

Is there some setting to resolve to the npm version if it's a dependency?

[Haroenv]

When I use a package that transitively depends on events, I get this:

https://github.com/Haroenv/remix-bug-report/blob/487e5b242e5ee377165e77da80f526d00c95191b/app/routes/index.tsx#L3

Dynamic import of "events" is not supported

I guess somehow it tries to import the builtin still?

[jtsiskin]

Same here:

within /public/build it tries to import events module:

[jtsiskin]

@mjackson are you able to fix this? You currently can't use any module which uses the 'events' in the browser in remix.
It needs to be bundled not external
For the simplest repo just var EventEmitter = require("events"); and console.log(EventEmitter)

https://github.com/remix-run/remix/blob/main/packages/remix-dev/compiler.ts#L310

[jtsiskin]

For anyone who needs a temporary workaround while this is fixed, here's my hack:
npm i patch-package
npm install @esbuild-plugins/node-modules-polyfill
npm install @esbuild-plugins/node-globals-polyfill

add this patch to patches/ : https://gist.github.com/jtsiskin/9f661fc35d5c4d1e91239f9b319693e0
npx patch-packages

Inside my root.tsx, within my , I then added
<script> var global = global || window; </script>

After than I had no more dependency issues

[arthuryeti]

@jtsiskin thank you! I'll update your gist for remix 1.1.3

[afk-mario]

"@remix-run/dev": "^1.2.1" added support for builtin node-modules-polyfill but not for node-globals-polyfill

New workaround patch:

diff --git a/node_modules/@remix-run/dev/compiler.js b/node_modules/@remix-run/dev/compiler.js
index d36818e..5f6a45b 100644
--- a/node_modules/@remix-run/dev/compiler.js
+++ b/node_modules/@remix-run/dev/compiler.js
@@ -19,6 +19,7 @@ var fse = require('fs-extra');
 var debounce = require('lodash.debounce');
 var chokidar = require('chokidar');
 var nodeModulesPolyfill = require('@esbuild-plugins/node-modules-polyfill');
+var nodeGlobalsPolyfill = require('@esbuild-plugins/node-globals-polyfill');
 var build$1 = require('./build.js');
 var config = require('./config.js');
 var warnings = require('./warnings.js');
@@ -329,7 +330,7 @@ async function createBrowserBuild(config, options) {
       "process.env.NODE_ENV": JSON.stringify(options.mode),
       "process.env.REMIX_DEV_SERVER_WS_PORT": JSON.stringify(config.devServerPort)
     },
-    plugins: [mdx.mdxPlugin(config), browserRouteModulesPlugin.browserRouteModulesPlugin(config, /\?browser$/), emptyModulesPlugin.emptyModulesPlugin(config, /\.server(\.[jt]sx?)?$/), nodeModulesPolyfill.NodeModulesPolyfillPlugin()]
+    plugins: [mdx.mdxPlugin(config), browserRouteModulesPlugin.browserRouteModulesPlugin(config, /\?browser$/), emptyModulesPlugin.emptyModulesPlugin(config, /\.server(\.[jt]sx?)?$/), nodeModulesPolyfill.NodeModulesPolyfillPlugin(), nodeGlobalsPolyfill.NodeGlobalsPolyfillPlugin()]
   });
 }

[arthuryeti]

@afk-mario thank you ser