Uncaught ReferenceError: global is not defined (at node_modules/amazon-cognito-identity-js/node_modules/buffer/index.js (index.js:43:30)) #11175

aoneahsan · 2023-04-03T04:06:04Z

Before opening, please confirm:

I have searched for duplicate or closed issues and discussions.
I have read the guide for submitting bug reports.
I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

React

Amplify APIs

Authentication

Amplify Categories

auth

Environment information

# Put output below this line

  System:
    OS: Windows 10 10.0.19045
    CPU: (8) x64 Intel(R) Core(TM) i7-6820HQ CPU @ 2.70GHz
    Memory: 16.93 GB / 31.85 GB
  Binaries:
    Node: 16.20.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - C:\Program Files\nodejs\yarn.CMD
    npm: 8.19.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (111.0.1661.62)
    Internet Explorer: 11.0.19041.1566
  npmPackages:
    @aws-amplify/api: ^5.0.23 => 5.0.23
    @aws-amplify/auth: ^5.2.1 => 5.2.1
    @aws-amplify/core: ^5.1.6 => 5.1.6
    @capacitor/app: ^4.1.1 => 4.1.1
    @capacitor/cli: ^4.7.3 => 4.7.3
    @capacitor/core: ^4.7.3 => 4.7.3
    @capacitor/dialog: ^4.1.0 => 4.1.0
    @capacitor/haptics: ^4.1.0 => 4.1.0
    @capacitor/keyboard: ^4.1.1 => 4.1.1
    @capacitor/preferences: ^4.0.2 => 4.0.2
    @capacitor/status-bar: ^4.1.1 => 4.1.1
    @cypress/angular:  0.0.0-development
    @cypress/mount-utils:  0.0.0-development
    @cypress/react:  0.0.0-development
    @cypress/react18:  0.0.0-development
    @cypress/svelte:  0.0.0-development
    @cypress/vue:  0.0.0-development
    @cypress/vue2:  0.0.0-development
    @ionic/react: ^7.0.0 => 7.0.0
    @ionic/react-router: ^7.0.0 => 7.0.0
    @testing-library/jest-dom: ^5.16.5 => 5.16.5
    @testing-library/react: ^14.0.0 => 14.0.0
    @testing-library/user-event: ^14.4.3 => 14.4.3
    @types/crypto-js: ^4.1.1 => 4.1.1
    @types/node: ^18.15.11 => 18.15.11 (14.18.42)
    @types/react: ^18.0.32 => 18.0.32
    @types/react-dom: ^18.0.11 => 18.0.11
    @types/react-router: ^5.1.20 => 5.1.20
    @types/react-router-dom: ^5.3.3 => 5.3.3
    @types/underscore: ^1.11.4 => 1.11.4
    @types/validator: ^13.7.14 => 13.7.14
    @typescript-eslint/eslint-plugin: ^5.57.0 => 5.57.0
    @typescript-eslint/parser: ^5.57.0 => 5.57.0
    @vitejs/plugin-react: ^3.1.0 => 3.1.0
    autoprefixer: ^10.4.14 => 10.4.14
    classnames: ^2.3.2 => 2.3.2
    crypto-js: ^4.1.1 => 4.1.1
    cypress: ^12.7.0 => 12.9.0
    dayjs: ^1.11.7 => 1.11.7
    eslint: ^8.37.0 => 8.37.0
    eslint-config-prettier: ^8.8.0 => 8.8.0
    eslint-plugin-react: ^7.32.2 => 7.32.2
    formik: ^2.2.9 => 2.2.9
    history: ^5.3.0 => 5.3.0 (4.10.1)
    husky: ^8.0.3 => 8.0.3
    ionicons: ^7.1.0 => 7.1.0
    ionicons-loader:  undefined ()
    ionicons/components:  undefined ()
    ionicons/icons:  7.1.0
    jsdom: ^21.1.0 => 21.1.1 (16.7.0)
    lint-staged: ^13.2.0 => 13.2.0
    postcss: ^8.4.21 => 8.4.21 (7.0.39)
    react: ^18.2.0 => 18.2.0
    react-dom: ^18.2.0 => 18.2.0
    react-router: ^5.3.4 => 5.3.4
    react-router-dom: ^5.3.4 => 5.3.4
    react-scripts: ^5.0.1 => 5.0.1
    react-toastify: ^9.1.2 => 9.1.2
    recoil: ^0.7.7 => 0.7.7
    tailwindcss: ^3.3.1 => 3.3.1
    ts-node: ^10.9.1 => 10.9.1
    typescript: ^5.0.3 => 5.0.3
    underscore: ^1.13.6 => 1.13.6
    validator: ^13.9.0 => 13.9.0
    vite: ^4.1.0 => 4.2.1
    vitest: ^0.29.2 => 0.29.8
  npmGlobalPackages:
    @ionic/cli: 7.0.0
    corepack: 0.17.0
    npm: 8.19.4
    prettier: 2.8.7
    yarn: 1.22.19

Describe the bug

index.js:43 Uncaught ReferenceError: global is not defined
at node_modules/amazon-cognito-identity-js/node_modules/buffer/index.js (index.js:43:30)
at __require2 (chunk-TFWDKVI3.js?v=4a4aa487:18:50)
at AuthenticationHelper.js:6:24
node_modules/amazon-cognito-identity-js/node_modules/buffer/index.js @ index.js:43
__require2 @ chunk-TFWDKVI3.js?v=4a4aa487:18
(anonymous) @ AuthenticationHelper.js:6

Expected behavior

I was working in ionic 6 + react project where it was using "react-scripts" to run the project, project was working fine, authentication was working as well.

because now we have ionic 7 so i upgraded my project, i created a new project and moved my code from old ionic 6 project to new ionic 7 project.

here now ionic have introduced "vite" in place of "react scripts" to run the project.

i have double checked that this error is with "Auth" module coming from "@aws-amplify/auth" by commenting "aws-amplify/auth" imports from project and project started working fine.

this line in "amazon-cognito-identity-js" package is giving this error, as you can see "global" constant is used here

Buffer.TYPED_ARRAY_SUPPORT = global.TYPED_ARRAY_SUPPORT !== undefined

i even tried resolving this error by adding

(window as any).global = window;

in my main.ts file but still getting this error.

Reproduction steps

Steps to reproduct the error (i have added a video link showing how i reproduced the error as well to help you through the process).

VIDEO LINK: https://www.awesomescreenshot.com/video/16170162?key=754ffb3f47ae3154f41b1df041c7511e

STEPS:

just create a simple ionic 7 + react project
install "@aws-amplify/core" and "@aws-amplify/auth" packages
import and use "Auth" module from "@aws-amplify/auth" package and it will give this error

Code Snippet

// Put your code below this line.
just use auth/api or any one of @aws-amplify/{package}    package and it will give error in newly created ionic 7 project (using @ionic/cli v7)

useEffect(() => {
	try {
		void Auth.currentSession();
	} catch (error) {}
}, []);

Log output

// Put your logs below this line

Uncaught ReferenceError: global is not defined
    at node_modules/amazon-cognito-identity-js/node_modules/buffer/index.js (index.js:43:30)
    at __require2 (chunk-TFWDKVI3.js?v=0313f93c:18:50)
    at AuthenticationHelper.js:6:24

aws-exports.js

No response

Manual configuration

No response

Additional configuration

{
  "name": "aws-amplify-cp-ionic7-react",
  "private": true,
  "version": "0.0.1",
  "description": "AWS Amplify CP1 Ionic 7.",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "tsc && vite build",
    "preview": "vite preview",
    "test.e2e": "cypress run",
    "test.unit": "vitest",
    "lint": "eslint",
    "sync:apps-config": "trapeze run apps-config.yaml",
    "lint-custom": "eslint --fix --ext .tsx,.ts ./src",
    "prettier": "prettier ./src --write",
    "version": "1.0.0",
    "optimize": "npm run prettier && npm run lint",
    "prepare": "husky install",
    "deploy": "git checkout aws-amplify-cp1-dev-deploy && git pull o aws-amplify-cp1 && git push o aws-amplify-cp1-dev-deploy && git checkout aws-amplify-cp1",
    "build:tailwind": "set \"NODE_ENV=production\" && npx tailwindcss -i ./src/styles/tailwind.css -o ./src/styles/tailwind-output.css",
    "postbuild": "npm run build:tailwind"
  },
  "dependencies": {
    "@aws-amplify/api": "^5.0.23",
    "@aws-amplify/auth": "^5.2.1",
    "@aws-amplify/core": "^5.1.6",
    "@capacitor/app": "^4.1.1",
    "@capacitor/core": "^4.7.3",
    "@capacitor/dialog": "^4.1.0",
    "@capacitor/haptics": "^4.1.0",
    "@capacitor/keyboard": "^4.1.1",
    "@capacitor/preferences": "^4.0.2",
    "@capacitor/status-bar": "^4.1.1",
    "@ionic/react": "^7.0.0",
    "@ionic/react-router": "^7.0.0",
    "classnames": "^2.3.2",
    "crypto-js": "^4.1.1",
    "dayjs": "^1.11.7",
    "formik": "^2.2.9",
    "history": "^5.3.0",
    "ionicons": "^7.1.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-scripts": "^5.0.1",
    "react-toastify": "^9.1.2",
    "recoil": "^0.7.7",
    "underscore": "^1.13.6",
    "validator": "^13.9.0",
    "react-router": "^5.3.4",
    "react-router-dom": "^5.3.4"
  },
  "devDependencies": {
    "@capacitor/cli": "^4.7.3",
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^14.0.0",
    "@testing-library/user-event": "^14.4.3",
    "@types/crypto-js": "^4.1.1",
    "@types/node": "^18.15.11",
    "@types/react": "^18.0.32",
    "@types/react-dom": "^18.0.11",
    "@types/react-router": "^5.1.20",
    "@types/react-router-dom": "^5.3.3",
    "@types/underscore": "^1.11.4",
    "@types/validator": "^13.7.14",
    "@typescript-eslint/eslint-plugin": "^5.57.0",
    "@typescript-eslint/parser": "^5.57.0",
    "@vitejs/plugin-react": "^3.1.0",
    "autoprefixer": "^10.4.14",
    "cypress": "^12.7.0",
    "eslint": "^8.37.0",
    "eslint-config-prettier": "^8.8.0",
    "eslint-plugin-react": "^7.32.2",
    "husky": "^8.0.3",
    "jsdom": "^21.1.0",
    "lint-staged": "^13.2.0",
    "postcss": "^8.4.21",
    "tailwindcss": "^3.3.1",
    "ts-node": "^10.9.1",
    "typescript": "^5.0.3",
    "vite": "^4.1.0",
    "vitest": "^0.29.2"
  },
  "eslintConfig": {
    "extends": [
      "eslint:recommended",
      "plugin:@typescript-eslint/recommended",
      "plugin:@typescript-eslint/recommended-requiring-type-checking",
      "react-app",
      "react-app/jest",
      "prettier"
    ],
    "parserOptions": {
      "project": [
        "./tsconfig.json"
      ]
    },
    "parser": "@typescript-eslint/parser",
    "plugins": [
      "@typescript-eslint"
    ],
    "root": true
  },
  "lint-staged": {
    "*.{js,jsx,ts,tsx}": [
      "prettier --write",
      "eslint --fix"
    ],
    "*.{css,html,json}": [
      "prettier --write"
    ]
  }
}

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

The text was updated successfully, but these errors were encountered:

aoneahsan · 2023-04-03T04:31:42Z

Attaching the demo project, so you can just "yarn install" in it and will be able to see the error once you run the project.

demo-aws-amplify-auth-error.zip

tannerabread · 2023-04-05T14:07:33Z

Hi @aoneahsan can you try out this solution

I tried it on your sample project and the global is not defined error went away

david-mcafee · 2023-04-07T22:43:02Z

For future reference - depending on the project setup, the Vite / React plugin may also be required:

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

// https://vitejs.dev/config/
export default defineConfig({
    plugins: [react()],
    define: {
        global: {},
    },
    server: {
        port: 3000,
    },
    resolve: {
        alias: {
            './runtimeConfig': './runtimeConfig.browser',
        },
    },
});

aoneahsan · 2023-04-08T10:10:26Z

HI there

@tannerabread sure let me try that (sorry for late reply)

david-mcafee · 2023-04-10T16:46:16Z

Any luck with that solution, @aoneahsan?

aoneahsan · 2023-04-10T17:49:58Z

Any luck with that solution, @aoneahsan?

i tried but i was not able to get it to work

(and i did not understand what these local reference files were supposed to have in them (so yes if you can provide a demo project repo link will be helpfull or explain what I'm doing wrong (sorry for trouble))).
Thanks.

aoneahsan · 2023-04-12T11:43:26Z

Hi @david-mcafee
Sorry for the trouble, but can you provide a repo with a working version of it (and also some resources where I can learn more about it)?

aoneahsan · 2023-04-12T11:44:06Z

Or a direct zip file here, whatever works for you.

tannerabread · 2023-04-12T13:13:21Z

Hi @aoneahsan for your zipped project you posted earlier, to get it working what I did was change vite.config.ts to the following:

// vite.config.ts

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vitejs.dev/config/
export default defineConfig({
  ...(process.env.NODE_ENV === 'development'
    ? {
      define: {
        global: {},
      },
    }
    : {}),
  plugins: [react()],
  test: {
    globals: true,
    environment: 'jsdom',
    setupFiles: './src/setupTests.ts',
  }
})

aoneahsan · 2023-04-13T09:15:35Z

@tannerabread
Thanks a lot, I tried the solution you gave, and it resolved the development error, but when I tried to build the project, it gave this error.

cwomack · 2023-04-20T13:55:30Z

@aoneahsan, can you see if updating the vite.config.ts to include the "resolve" import and subsequent plugin (as shown below) fixes the new build error you're seeing?

// vite.config.ts

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import resolve from '@rollup/plugin-node-resolve';

// https://vitejs.dev/config/
export default defineConfig({
  ...(process.env.NODE_ENV === 'development'
    ? {
      define: {
        global: {},
      },
    }
    : {}),
  plugins: [
    react(),
    resolve()
  ],
  test: {
    globals: true,
    environment: 'jsdom',
    setupFiles: './src/setupTests.ts',
  }
})

aoneahsan · 2023-04-25T09:58:47Z

@cwomack
i tried the solution you mentioned but it's not working.

cwomack · 2023-05-08T20:45:24Z

@aoneahsan are you still getting the same build errors? If so, maybe this comment about including resolve in the vite.config.js as seen below will fix the issue:

resolve: {
    alias: {
      './runtimeConfig': './runtimeConfig.browser',
    },
}

Let me know if that doesn't work and what errors you're still seeing, please!

nadetastic · 2023-05-09T20:33:09Z

Related to #9639

david-mcafee · 2023-05-11T02:05:57Z

@aoneahsan - I have a sample Vite project that I use for testing against Amplify, could you compare your config / dependencies against what I have? Perhaps that may be the most straightforward way to see what your issue may be. Thanks!!

Arlen22 · 2023-05-22T18:35:03Z

I'm getting the same error with an Angular 15 project. The problem is that the buffer module, which is intended for use in the browser, refers to a global variable which is a Node-only way of accessing global as far as I can tell. Even the latest version of amazon-cognito-identity-js (6.2.0) refers to a specific version of buffer which has this problem (4.9.2). However, that has been downloaded some 13 million times, which indicates that something about that is expected, I guess, although I don't really understand what's going on.

ryanmz1 · 2023-05-26T15:41:58Z

I'm getting the same error with an Angular 15 project. The problem is that the buffer module, which is intended for use in the browser, refers to a global variable which is a Node-only way of accessing global as far as I can tell. Even the latest version of amazon-cognito-identity-js (6.2.0) refers to a specific version of buffer which has this problem (4.9.2). However, that has been downloaded some 13 million times, which indicates that something about that is expected, I guess, although I don't really understand what's going on.

Hey @Arlen22 , I use angular too. I don't know the rationale but you can try adding global = globalThis (before app-root tag) to index.html, like this:

<body>
   <script>
     global = globalThis //<- this line
   </script>
   <app-root></app-root>
</body>

Reference from this Uncaught ReferenceError: global is not defined

Arlen22 · 2023-06-10T15:00:05Z

Yeah, that's what I ended up doing. I also opened an issue on the buffer project, but since this is an older version with 13 million downloads, fixing this "bug" would be a breaking change, so I doubt it will happen there.

Naikno · 2023-07-03T22:41:21Z

@Arlen22 i'm also use angular 15, and what i done to avoid to touch the html was to expose a polyfills.ts file creating a file and refer to it from angular.json

like

      "architect": {
        "build": {
          ..
          "options": {
          ...
            "polyfills": [
              "src/polyfills.ts"
            ],
            ...

and add inside

import 'zone.js';
(window as any).global = window;

david-mcafee · 2023-07-10T22:55:20Z

@Arlen22 @Naikno - I recently tested using Amplify with Angular following the Amplify "Getting Started" docs for Angular, and did not encounter any issues. Can you take a look at the guide and see if any of the guidance there resolves the issues you are seeing? Thanks!

david-mcafee · 2023-07-17T16:42:43Z

@Arlen22 @Naikno - closing this ticket as we have not heard back from you. If you need further assistance, please let us know!

airalpha · 2023-08-01T07:54:38Z

For future reference - depending on the project setup, the Vite / React plugin may also be required:

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

// https://vitejs.dev/config/
export default defineConfig({
    plugins: [react()],
    define: {
        global: {},
    },
    server: {
        port: 3000,
    },
    resolve: {
        alias: {
            './runtimeConfig': './runtimeConfig.browser',
        },
    },
});

added

define: {
  global: {}  
}

worked for me

…/amplify-js#11175

KalpeshSipify · 2023-10-05T06:31:13Z

For future reference - depending on the project setup, the Vite / React plugin may also be required:

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

// https://vitejs.dev/config/
export default defineConfig({
    plugins: [react()],
    define: {
        global: {},
    },
    server: {
        port: 3000,
    },
    resolve: {
        alias: {
            './runtimeConfig': './runtimeConfig.browser',
        },
    },
});

thanks this is working.
For Other go to Vite.Config.js and paste this code
define: {

    global: {},
},

inside define config

Rahulchoudhary742000 · 2023-11-02T07:34:45Z

For future reference - depending on the project setup, the Vite / React plugin may also be required:

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

// https://vitejs.dev/config/
export default defineConfig({
    plugins: [react()],
    define: {
        global: {},
    },
    server: {
        port: 3000,
    },
    resolve: {
        alias: {
            './runtimeConfig': './runtimeConfig.browser',
        },
    },
});

really thanks man ...❤️ its working fine.

UchihaYuki · 2024-07-30T17:11:06Z

I'm curious why this error only exists in Angular apps. I wrote an npm package and used the buffer package. It has no problem running in browser when testing, but after switching to Angular the problem appears.

aoneahsan added the pending-triage Issue is pending triage label Apr 3, 2023

cwomack added the amazon-cognito-identity-js Used for issues related to this specific package within the monorepo label Apr 3, 2023

cwomack self-assigned this Apr 3, 2023

jimblanc removed the pending-triage Issue is pending triage label Apr 7, 2023

david-mcafee self-assigned this Apr 10, 2023

tannerabread added the investigating This issue is being investigated label Apr 12, 2023

cwomack assigned nadetastic May 9, 2023

david-mcafee added the pending-close-response-required label May 15, 2023

david-mcafee closed this as completed Jul 17, 2023

jmeyers91 added a commit to jmeyers91/aedi that referenced this issue Sep 21, 2023

Fixed issue with Vite and the aws cognito client library: aws-amplify…

fefd5d2

…/amplify-js#11175

cwomack mentioned this issue Dec 22, 2023

Uncaught ReferenceError: global is not defined #12746

Closed

3 tasks

diego-dxc mentioned this issue Feb 20, 2024

PIN-4519: Login and registration flow pagopa/interop-probing-core#3

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uncaught ReferenceError: global is not defined (at node_modules/amazon-cognito-identity-js/node_modules/buffer/index.js (index.js:43:30)) #11175

Uncaught ReferenceError: global is not defined (at node_modules/amazon-cognito-identity-js/node_modules/buffer/index.js (index.js:43:30)) #11175

aoneahsan commented Apr 3, 2023 •

edited by tannerabread

Loading

aoneahsan commented Apr 3, 2023

tannerabread commented Apr 5, 2023

david-mcafee commented Apr 7, 2023 •

edited

Loading

aoneahsan commented Apr 8, 2023

david-mcafee commented Apr 10, 2023

aoneahsan commented Apr 10, 2023

aoneahsan commented Apr 12, 2023

aoneahsan commented Apr 12, 2023

tannerabread commented Apr 12, 2023

aoneahsan commented Apr 13, 2023

cwomack commented Apr 20, 2023

aoneahsan commented Apr 25, 2023

cwomack commented May 8, 2023 •

edited

Loading

nadetastic commented May 9, 2023

david-mcafee commented May 11, 2023 •

edited

Loading

Arlen22 commented May 22, 2023

ryanmz1 commented May 26, 2023

Arlen22 commented Jun 10, 2023

Naikno commented Jul 3, 2023

david-mcafee commented Jul 10, 2023

david-mcafee commented Jul 17, 2023

airalpha commented Aug 1, 2023 •

edited

Loading

KalpeshSipify commented Oct 5, 2023

Rahulchoudhary742000 commented Nov 2, 2023 •

edited

Loading

UchihaYuki commented Jul 30, 2024

Uncaught ReferenceError: global is not defined (at node_modules/amazon-cognito-identity-js/node_modules/buffer/index.js (index.js:43:30)) #11175

Uncaught ReferenceError: global is not defined (at node_modules/amazon-cognito-identity-js/node_modules/buffer/index.js (index.js:43:30)) #11175

Comments

aoneahsan commented Apr 3, 2023 • edited by tannerabread Loading

Before opening, please confirm:

JavaScript Framework

Amplify APIs

Amplify Categories

Environment information

Describe the bug

Expected behavior

Reproduction steps

Code Snippet

Log output

aws-exports.js

Manual configuration

Additional configuration

Mobile Device

Mobile Operating System

Mobile Browser

Mobile Browser Version

Additional information and screenshots

aoneahsan commented Apr 3, 2023

tannerabread commented Apr 5, 2023

david-mcafee commented Apr 7, 2023 • edited Loading

aoneahsan commented Apr 8, 2023

david-mcafee commented Apr 10, 2023

aoneahsan commented Apr 10, 2023

aoneahsan commented Apr 12, 2023

aoneahsan commented Apr 12, 2023

tannerabread commented Apr 12, 2023

aoneahsan commented Apr 13, 2023

cwomack commented Apr 20, 2023

aoneahsan commented Apr 25, 2023

cwomack commented May 8, 2023 • edited Loading

nadetastic commented May 9, 2023

david-mcafee commented May 11, 2023 • edited Loading

Arlen22 commented May 22, 2023

ryanmz1 commented May 26, 2023

Arlen22 commented Jun 10, 2023

Naikno commented Jul 3, 2023

david-mcafee commented Jul 10, 2023

david-mcafee commented Jul 17, 2023

airalpha commented Aug 1, 2023 • edited Loading

KalpeshSipify commented Oct 5, 2023

Rahulchoudhary742000 commented Nov 2, 2023 • edited Loading

UchihaYuki commented Jul 30, 2024

aoneahsan commented Apr 3, 2023 •

edited by tannerabread

Loading

david-mcafee commented Apr 7, 2023 •

edited

Loading

cwomack commented May 8, 2023 •

edited

Loading

david-mcafee commented May 11, 2023 •

edited

Loading

airalpha commented Aug 1, 2023 •

edited

Loading

Rahulchoudhary742000 commented Nov 2, 2023 •

edited

Loading