The First Gate of Javascript Hell

After starting this post, I coincidentally read the fantastic Javascript Gom Jabbar - never have I sympathized more with a 12 year old Paul Atreides going through the Gom Jabbar test.

I recently told a friend that I didn’t understand all the hate for Typescript - it’s usually been a fairly productive language for me. What I forgot is the sheer pain that comes with bootstrapping a new project while navigating the myriad options available to you today with bundlers and frameworks. I’d hoped that all these new-age better-than-before your-grandpa-wished-he-had-this bundlers would work seamlessly with basically any package I threw at it, but it turns out that isn’t the case.

I’ve been looking into running ML models in the browser recently, and one of the first examples I found involved using Jimp which self-identifies as “An image processing library for Node written entirely in JavaScript, with zero native dependencies.”. ‘Written entirely in Javascript!’ I thought, ‘this was going to be the easiest integration process of my life’. A greater fool could not be found at that moment.

I started a new Vite project, as one does, it is after all “Next Generation Frontend Tooling”. With that kind of tagline it’s only a matter of time before it’s VC funded. I was feeling spicy that morning, so I decided to start a Vite + Svelte (+ Typescript, please use Typescript) project and install Jimp. A simple man with a simple goal. npm run build and…

"mkdir" is not exported by "__vite-browser-external", imported by "node_modules/@jimp/core/node_modules/mkdirp/dist/mjs/opts-arg.js".

The next few hours were decidedly NOT fun, which is usually my main goal when I’m working with Svelte. Still I trudged on, determined to make it work. I switched to a Vite + React (+ Typescript) build, but still no dice - I was hoping React’s popularity would solve all my problems.

The only thing that did end up working was using Next.JS in the same configuration that the original author had. Next self-identifies as “The React Framework for the Web”, which was news to me since I’d always assumed I was writing React for the web anyway, but here we are. After all these hours, I was back to a configuration of Next and Webpack (not Turbopack), and felt like Brendon Eich running the first Javascript file without any next-generation tooling.

I don’t think this is Jimp’s fault at all, the author is super active on Github for this unpaid second job they have, but why, oh why is it so hard to run Javascript code anywhere? Complexity is a given when you’re trying to server-side bundle-split tree-shake but does a normie building a prototype really have to care or deal with any of that?

Next time on “Potato Pouts” - “How do I get this text file into the docker container hosted on my remote dev environment in the cloud, while sitting with my laptop on my couch?”