Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ESM Support #336

Open
naftalimurgor opened this issue Nov 23, 2023 · 4 comments
Open

ESM Support #336

naftalimurgor opened this issue Nov 23, 2023 · 4 comments

Comments

@naftalimurgor
Copy link

Hey,
Noob question here: From the docs, we should:

var Buffer = require('buffer/').Buffer  // note: the trailing slash is important!

Question: How does one use the import/export style and is it supported?

For example:

import { Buffer } from 'buffer/'

Ty!

@gustawdaniel
Copy link

In my case

Rollup failed to resolve import "buffer/" 

@naftalimurgor
Copy link
Author

Got the same for the import syntax. Let me know once you get around this.

@guest271314
Copy link

Here you go https://gist.github.com/guest271314/08b19ba88c98a465dd09bcd8a04606f6

git clone https://github.com/feross/buffer
cd buffer
bun install base64-js ieee754
bun build ./index.js --target=browser --outfile=buffer.js

Importing with node, deno, bun, quickjs-ng, txiki.js

const url =
  "https://gist.githubusercontent.com/guest271314/08b19ba88c98a465dd09bcd8a04606f6/raw/aac580355cfe4b4a0d6e20a493fca028dfe62dbb/buffer.js";

console.log(navigator.userAgent);

if (navigator.userAgent.includes("txiki.js")) {
  try {
    const { Buffer } = await import(url);
    console.log(Buffer.from([0]));
  } catch (e) {
    console.log(e);
  }
}

if (navigator.userAgent.includes("quickjs-ng")) {
  try {
    const { Buffer } = await import("../buffer/buffer.js");
    console.log(JSON.stringify([...Buffer.from([0])]));
  } catch (e) {
    console.log(e);
  }
}

if (navigator.userAgent.includes("Deno")) {
  const ab = new Blob([
    await (await fetch(url)).arrayBuffer(),
  ], {
    type: "text/javascript",
  });
  try {
    const { Buffer } = await import(URL.createObjectURL(ab));
  } catch (e) {
    console.log(e);
  }
}

if (navigator.userAgent.includes("Node")) {
  try {
    const text = await (await fetch(url)).text();
    const dataURL = `data:text/javascript;base64,${btoa(text)}`;
    const { Buffer } = await import(dataURL);
    console.log(Buffer.from([0]));
  } catch (e) {
    console.log(e);
  }
}

Bun doesn't work as expected with dynamic network imports

if (navigator.userAgent.includes("Bun")) {
  try {
    const text = await (await fetch(url)).text();
    const dataURL = `data:text/javascript;base64,${btoa(text)}`;
    const { Buffer } = await import(dataURL);
    console.log(Buffer.from([0]));
  } catch (e) {
    console.log(e);
  }
}

@chjj
Copy link
Contributor

chjj commented Jan 24, 2024

import { Buffer } from 'buffer/index.js';

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants