global is not defined on initialization of library

[joaoeudes7]

I give this error on initialization of library, i don't know which dependency is using text-encode-uft-8 and define to use global (and if it is really necessary), sorry if i'm posting in the wrong place, but the error is ending in this library (Thrill be borsh or bs58).

The console show the error:

07:52:26.380 Uncaught ReferenceError: global is not defined
    js index.js:36
    __require2 chunk-G3IZEHTJ.js:17
    node_modules chunk-OAVHP7RA.js:24344
    __init chunk-G3IZEHTJ.js:14
    <anonymous> @solana_web3_js:2
index.js:36:21
    js index.js:36
    __require2 chunk-G3IZEHTJ.js:17
    js chunk-OAVHP7RA.js:24344
    __init chunk-G3IZEHTJ.js:14
    <anonymous> @solana_web3_js:2
    InnerModuleEvaluation self-hosted:2384
    InnerModuleEvaluation self-hosted:2384
    InnerModuleEvaluation self-hosted:2384
    InnerModuleEvaluation self-hosted:2384
    evaluation self-hosted:2335

The file in reference shows the use from "./node_modules/@solana/web3.js/lib/index.browser.esm.js":

const bn_js_1 = __importDefault(require("bn.js"));
const bs58_1 = __importDefault(require("bs58"));
// TODO: Make sure this polyfill not included when not required
const encoding = __importStar(require("text-encoding-utf-8"));
const TextDecoder = (typeof global.TextDecoder !== 'function') ? encoding.TextDecoder : global.TextDecoder;
const textDecoder = new TextDecoder('utf-8', { fatal: true });
function baseEncode(value) {
    if (typeof (value) === 'string') {
        value = Buffer.from(value, 'utf8');
    }
    return bs58_1.default.encode(Buffer.from(value));
}
exports.baseEncode = baseEncode;
function baseDecode(value) {
    return Buffer.from(bs58_1.default.decode(value));
}
exports.baseDecode = baseDecode;
const INITIAL_LENGTH = 1024;

See typeof global.TextDecoder and const encoding = __importStar(require("text-encoding-utf-8"))

About my project:

• Vue 3 + Vite
• Typescript
• solana-web3.js v1.14.0

Browser: Firefox Developer 89

[jstarry]

@joaoeudes7 did you fix this issue?

[NorbertBodziony]

Bumping also hitting this problem with Vite and Parcel.
Even created issue on Parcel repo parcel-bundler/parcel#6453
@jstarry there is link to repo in issue so you can reproduce

[jstarry]

Great, thanks @NorbertBodziony

[joaoeudes7]

Sorry for the delay in responding, @jstarry, @NorbertBodziony
I recommend migrating to Webpack, because Vite not has support to modules of node as (stream and others) (Uncaught Error: Module "stream" has been externalized for browser compatibility and cannot be accessed in client code.) or install all modules manually

But you can resolve this problem of issue in specific, add this code in you html base (of public folder)

<script>
  if (global === undefined) {
    var global = window;
  }
</script>

[NorbertBodziony]

Thanks, @joaoeudes7. I think webpack 5 will also not work with node modules in browser.
With webpack 4 everything works just fine.

[Standaa]

Just tested and made a small vanilla repro here: https://github.com/Standaa/vite-pg
Same problem, global not defined.
Parcel 2 does not work either (Fwiw, I had noticed the CORS preflight was broken on it).
It does work, however, with parcel-bundler (v1) which is already much quicker than webpack.

[NorbertBodziony]

Seems like web3 package also does not work vitejs/vite#3817

[github-actions]

Because there has been no activity on this issue for 7 days since it was closed, it has been automatically locked. Please open a new issue if it requires a follow up.