egoist / egoist/tsup

How to use a polyfill for node.js Buffer?

Open
#882 2 comments 2 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
11.3k
Forks
275
PR merge metrics
No merged PRs in 30d

Description

Hello,

I working on an app handling GIS shape files. To support shape files, I am using a package called [shpjs](https://github.com/calvinmetcalf/shapefile-js) which in turn uses [jszip](https://stuk.github.io/jszip/). Both of them depend on nodejs Buffer.

I am trying to use the[ `node-stdlib-browser` package](https://github.com/niksy/node-stdlib-browser#esbuild) to polyfill `Buffer` but have not been successful.

Please see my tsup config below:

```typescript
import { defineConfig } from "tsup";
//@ts-ignore
import nodeStdLibBrowswerPlugin from "node-stdlib-browser/helpers/esbuild/plugin";
import { default as stdLibBrowser } from "node-stdlib-browser";

import { createRequire } from "node:module";
const require = createRequire(import.meta.url);

export default defineConfig({
platform: "browser",
esbuildOptions: (options, context) => {
options.inject = [require.resolve("node-stdlib-browser/helpers/esbuild/shim")];
options.define = {
global: "global",
process: "process",
Buffer: "Buffer",
};
},
esbuildPlugins: [nodeStdLibBrowswerPlugin(stdLibBrowser)],
inject: [require.resolve("node-stdlib-browser/helpers/esbuild/shim")],
define: {
global: "global",
process: "process",
Buffer: "Buffer",
},
});

```

But still I get an error in JSZip.

image

Am I setting up polyfill correctly?

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the reported JSZip error with the tsup configuration shown in the issue. Inspect the generated browser bundle and the node-stdlib-browser esbuild plugin and shim setup to determine whether Buffer is being replaced. Done means the GIS shape-file app bundles and runs in the browser without the JSZip Buffer error.

Written by the indexing model from the issue text.

Assessment

Tech stack
node.js, typescript
Domain
build-system, tooling, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.