Fatal error when import `{calendar}` from '@googleapis/calendar'

[albertpratomo]

Environment details

• OS: macOs 14 Sonoma
• Node.js version: 19
• npm version: pnpm 8.8
• googleapis version: "@googleapis/calendar": "^9.3.1",

Steps to reproduce

1. import {calendar} from '@googleapis/calendar'
2. This error shows up in the browser console, and the Vue 3 app doesnt load at all:

index.ts:29 Uncaught TypeError: Class extends value undefined is not a constructor or null
  at node_modules/.pnpm/[email protected]/node_modules/agent-base/dist/index.js (index.ts:29:42)
  at __require (chunk-6TJCVOLN.js?v=9bec359e:4:50)
  at node_modules/.pnpm/[email protected]/node_modules/https-proxy-agent/dist/index.js (index.ts:7:1)
  at __require (chunk-6TJCVOLN.js?v=9bec359e:4:50)
  at node_modules/.pnpm/[email protected]/node_modules/gaxios/build/src/gaxios.js (gaxios.ts:33:1)
  at __require (chunk-6TJCVOLN.js?v=9bec359e:4:50)
  at node_modules/.pnpm/[email protected]/node_modules/gaxios/build/src/index.js (index.ts:15:1)
  at __require (chunk-6TJCVOLN.js?v=9bec359e:4:50)
  at node_modules/.pnpm/[email protected]/node_modules/gcp-metadata/build/src/index.js (index.ts:8:1)
  at __require (chunk-6TJCVOLN.js?v=9bec359e:4:50)

[alexander-fenster]

Hi @albertpratomo,

Just to double check - are you using the library in browser? How exactly - is it webpack or something else?

We don't officially support using these libraries in browser. Having that said, it's technically possible, but it will require some tweaks. If you happen to use webpack, this config file https://github.com/googleapis/google-api-nodejs-client/blob/main/src/apis/calendar/webpack.config.js will give you an idea which modules to block from getting into the bundle (specifically, https-proxy-agent should not get there).

[albertpratomo]

Yeah in the browser. I'm using Vite.

Okay I will try to exclude those packages from the bundle, let me try

[stevau5]

Any luck @albertpratomo ?

[anatoliykmetyuk]

Same problem when having this line:

  const oauth2Client = new google.auth.OAuth2();

My setup is Vite and React.

@alexander-fenster if these are not the right libs to use from a browser, then which libs should we use from a browser to interact with the Google API?

[chepoluis]

Same problem with const oauth2Client = new google.auth.OAuth2();

Setup React and Vite. :/

[ahostert]

I have the same issue. Vite and Vue3 with Node 21.2.0

@googleapis_calendar.js?v=a78ca205:1027 Uncaught TypeError: Class extends value undefined is not a constructor or null at node_modules/gaxios/node_modules/agent-base/dist/index.js (@googleapis_calendar.js?v=a78ca205:1027:36) at __require (chunk-76J2PTFD.js?v=a78ca205:3:50) at node_modules/gaxios/node_modules/https-proxy-agent/dist/index.js (@googleapis_calendar.js?v=a78ca205:1232:24) at __require (chunk-76J2PTFD.js?v=a78ca205:3:50) at node_modules/gaxios/build/src/gaxios.js (@googleapis_calendar.js?v=a78ca205:1355:31) at __require (chunk-76J2PTFD.js?v=a78ca205:3:50) at node_modules/gaxios/build/src/index.js (@googleapis_calendar.js?v=a78ca205:1653:20) at __require (chunk-76J2PTFD.js?v=a78ca205:3:50) at node_modules/gcp-metadata/build/src/index.js (@googleapis_calendar.js?v=a78ca205:3654:20) at __require (chunk-76J2PTFD.js?v=a78ca205:3:50)

[tspython]

has anyone figured it out? i get the same issue with another google api

[hruthik-bionic]

I'm having the same issue with the youtube api with Nuxt js

[oefeningen]

Same error trying to use google drive api with quasar.js and vite