V5.2.1 Next.js break?

[titong0]

Steps to reproduce

1. Create next.js project or clone repo: https://github.com/titong0/youtubejs-repro
2. run npm run dev or npx next dev
3. visit localhost:3000

Failure Logs

- error Error [ReferenceError]: Cannot access 'EventEmitter' before initialization
    at file:///C:/Users/Tiktok/Desktop/repro/node_modules/youtubei.js/dist/src/parser/youtube/LiveChat.js:16:24
    at ModuleJob.run (node:internal/modules/esm/module_job:198:25)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:385:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15) {
  digest: undefined
}

Expected behavior

no crash

Current behavior

crashes

Version

Default

Anything else?

Not sure if this has anything to do with the EventTarget and CustomEvent are required. portion of the docs. Sorry if this is silly but I have no clue. Btw my node version is v16.15.0

Checklist

• I am running the latest version.
• I checked the documentation and found no answer.
• I have searched the existing issues and made sure this is not a duplicate.
• I have provided sufficient information.

[absidue]

The issue is caused you using the agnostic export but not calling Platform.load to tell YouTube.js about your platform, e.g. which classes are supported natively and which ones need polyfills.

The agnostic export is not documented, as it should only be used by people trying to use YouTube.js on an unsupported platform. As you are using Next.js, you'll either be running YouTube.js within a browser or on your node 16 setup. Both are already supported by YouTube.js, so you don't need to use the export that requires you to register your own platform support.

If you are planning to run YouTube.js on the server side, use the standard export (youtubei.js), if you are planning to run it in the browser, use the unbundled (this allows next.js to do the bundling for you) web export (youtubei.js/web).

[titong0]

Thanks a lot for the explanation!

[titong0]

Sorry, just tried importing "youtubei.js" but now I am getting this error:

- error ./node_modules/youtubei.js/dist/src/platform/jsruntime/jinter.js:1:0
Module not found: Default condition should be last one

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./node_modules/youtubei.js/dist/src/platform/web.js
./pages/index.jsModule not found: Default condition should be last one

My guess is this has something to do with the jinter directory which is imported by the web version of the library, however this should not be the case as I am importing the node version and not the web one.

[titong0]

After digging a bit more, I found out that the crash was being caused by a bad export order in the jintr package. Apparently, it was fixed here, but when doing npm i youtubei.js@latest the file node_modules\youtubei.js\package.json has:

  "dependencies": {
    "jintr": "^1.0.0",
  },

and then, node_modules\jintr\package.json has

  "version": "1.0.0",
  "exports": {
    ".": {
      "node": {
        "import": "./dist/index.js",
        "require": "./bundle/jinter.cjs"
      },
         ERROR LINE HERE ⬇️
      "default": "./dist/index.js",
      "types": "./dist/index.d.ts"
    }
  },

My guess is that even though it is not documented, the 1.1.0 release also reorders the exports, so it is necessary to change the version used by youtubei.js. Should this go in a PR instead? I am new to opne source but I would be glad to help.

[LuanRT]

Feel free to open a PR!