Build fails after updating to v4.22.0

[itsnorbertkalacska]

AgoraRTC SDK version

4.22.0

Fail Rate

100%

Link to minimal reproduction

https://github.com/itsnorbertkalacska/Agora-Bug-Repro

Steps to reproduce

1. setup a react application with agora-rtc-sdk-ng v4.21.0
2. use AREAS and / or RemoteStreamFallbackType from the package import { AREAS } from 'agora-rtc-sdk-ng'
3. upgrade to v4.22.0 from v4.21.0

What is expected?

The build succeeds just as it did previously.

What is actually happening?

Nothing was mentioned or reported in the release notes about changing this export. Also the type definitions are there so TS does not pick up this error however build fails.

System Info

No response

Any additional comments?

No response

[simo-an]

Hi @itsnorbertkalacska ,

sdk does not support import { AREAS } from 'agora-rtc-sdk-ng' . If you want to use AREAS, Try the following code:

import AgoraRTC from "agora-rtc-sdk-ng";
console.log(AgoraRTC.AREAS);

[itsnorbertkalacska]

It does work this way, however it seems like the type definitions weren't updated. I need to disable TS for it to work, TS complains about it.

[itsnorbertkalacska]

Also we've been using import { AREAS } from 'agora-rtc-sdk-ng' for a while. When did you stop supporting it?

[itsnorbertkalacska]

We also saw the same issue with RemoteStreamFallbackType. I can't use AgoraRTC.RemoteStreamFallbackType so I think we'll wait with the update

[simo-an]

Hi @itsnorbertkalacska

Thanks for your feedback !

Agora SDK only export one default variable "AgoraRTC“，and AREA, RemoteStreamFallbackType ... is an attribute of AgoraRTC.

At previous SDK, we only provide umd format file even if you are using “import ...” (es6 syntax) to use SDK.
At current version, we provide esm format for "import ..." syntax.

So: why import { AREAS } from 'agora-rtc-sdk-ng' is worked at previous version ?

Because webpack/vite plugin transformed it, and fetch AREA from AgoraRTC.

Let me show you a negative example: import { AgoraRTCErrorCode } from 'agora-rtc-sdk-ng'，you will see that AgoraRTCErrorCode is undefined when console log it. That is because AgoraRTCErrorCode is not an attribute of AgoraRTC.

SO, use AgoraRTC.AREAS is the right way. Maybe we will update ts type definitions to cancel ts error.

---

If you insist to use import AREAS instead of AgoraRTC.AREAS, you can use our esm-bundler format sdk

code : import { AREAS } from 'agora-rtc-sdk-ng/esm'

check demo: https://github.com/AgoraIO/agora-rtc-web/blob/main/projects/quick-demo-react/src/App.tsx

Note: Don't use esm and esm-bundler at one project.