Esbuild: Cannot resolve node libs: path, events

[g-a-v-i-n]

Hi! First, this project is extremely impressive to me. One of the biggest things that breaks my flow when programming these days is the speed of the build tooling. It's very exciting to see a project that addresses this need.

As I was trying this out, I ran into some issues with 3rd party modules which include path and events:

node_modules/replace-ext/index.js:3:19: error: Could not resolve "path"  
var path = require('path');

node_modules/htmlparser2/lib/Parser.js:20:23: error: Could not resolve "events"
var events_1 = require("events");

The 3rd party library in question is react-markdown.

I know esbuild isn't quite ready for prime time, but was wondering if you had any pointers with these. Thanks!

Building for browser
Using Typescript + React
Build command: esbuild src/index.tsx --bundle --outdir=dist
Node 10.0.0
Mac OS Catalina 10.15.2 (19C57)

[evanw]

This happens because esbuild doesn't currently attempt to replicate the full node environment in the browser. It just bundles together the JavaScript you provide to it.

I think it should be possible to shim these particular libraries by installing https://www.npmjs.com/package/path-browserify and https://www.npmjs.com/package/events and then adding this to your project's package.json:

"browser": {
  "path": "path-browserify"
},

This tells esbuild to remap the path package to the path-browserify package. It's the same convention that other bundlers use when targeting the browser.

However, when you try to use the react-markdown package, it will still crash at run time because it attempts to call process.cwd(). Since esbuild doesn't do anything special about replicating the node environment in the browser, it doesn't do anything to ensure that there's a global called process in the browser. You can shim that yourself though by installing https://www.npmjs.com/package/process and then running this code before the react-markdown package is required:

window.process = require('process')

Does that work for you?

[evanw]

FWIW I was able to get the react-markdown package to work in the browser after building with esbuild using the flags --define:process.cwd=String and --define:process.env.NODE_ENV='"production"' as well as the path-browserify path substitution mentioned above.

I'm closing this issue as I believe this information is sufficient to address the issue.