Angular 6 Uncaught TypeError: Cannot assign to read only property 'exports' of object '[object Object]' ;

[fmvgs]

Hello,

I have an angular (version 6) appplication and I'm trying do use twilio-video.
When I do ng serve it works ok.
But when I do a ng build --prod, deploy and try to access I get the errors on the browser.

I've tested with a mininal angular app from version 6 to 11.
For versions 6 and 7 I get the same error but for versions 8 to 11 the application loads in the browser.

• I have verified that the issue occurs with the latest twilio-video.js release and is not marked as a known issue in the CHANGELOG.md.
• I reviewed the Common Issues and open GitHub issues and verified that this report represents a potentially new issue.
• I verified that the Quickstart application works in my environment.
• I am not sharing any Personally Identifiable Information (PII)
  or sensitive account information (API keys, credentials, etc.) when reporting this issue.

Code to reproduce the issue:

Initialize an simple application (commands just for 6 and 7 that would not work and for version 8 the lowest version I tried that worked)

npx -p @angular/[email protected] ng new sample-application
npx -p @angular/[email protected] ng new sample-application
npx -p @angular/[email protected] ng new sample-application

on tsconfig.json add

"skipLibCheck": true

on app.component.ts add import

import { createLocalTracks } from 'twilio-video';

and add ngOnInit method

  ngOnInit(): void {
    createLocalTracks({
      audio: true,
      video: { width: 640 }
    });
  }

Expected behavior:

The app would load in browser with no error

Actual behavior:

On Chrome the error message says:

Uncaught TypeError: Cannot assign to read only property 'exports' of object '[object Object]'
    at Module.<anonymous> (main.2ed390a91deb965270d8.js:1:122334)
    at Module.BG0f (main.2ed390a91deb965270d8.js:1:122339)
    at f (runtime.06daa30a2963fa413676.js:1:507)
    at Object.x3fV (main.2ed390a91deb965270d8.js:1:369407)
    at f (runtime.06daa30a2963fa413676.js:1:507)
    at Object.NBph (main.2ed390a91deb965270d8.js:1:182832)
    at f (runtime.06daa30a2963fa413676.js:1:507)
    at Object.Qvpb (main.2ed390a91deb965270d8.js:1:195801)
    at f (runtime.06daa30a2963fa413676.js:1:507)
    at 3h4Y (main.2ed390a91deb965270d8.js:1:58827)

More detail on the location of the error

And on firefox I get:

Uncaught TypeError: "exports" is read-only
    qnQj http://localhost:8080/sample-application6/main.375584df9acaffbe0406.js:1
    qnQj http://localhost:8080/sample-application6/main.375584df9acaffbe0406.js:1
    f http://localhost:8080/sample-application6/runtime.06daa30a2963fa413676.js:1
    x3fV http://localhost:8080/sample-application6/main.375584df9acaffbe0406.js:1
    f http://localhost:8080/sample-application6/runtime.06daa30a2963fa413676.js:1
    NBph http://localhost:8080/sample-application6/main.375584df9acaffbe0406.js:1
    f http://localhost:8080/sample-application6/runtime.06daa30a2963fa413676.js:1
    Qvpb http://localhost:8080/sample-application6/main.375584df9acaffbe0406.js:1
    f http://localhost:8080/sample-application6/runtime.06daa30a2963fa413676.js:1
    3h4Y http://localhost:8080/sample-application6/main.375584df9acaffbe0406.js:1
    f http://localhost:8080/sample-application6/runtime.06daa30a2963fa413676.js:1
    zUnb http://localhost:8080/sample-application6/main.375584df9acaffbe0406.js:1
    f http://localhost:8080/sample-application6/runtime.06daa30a2963fa413676.js:1
    0 http://localhost:8080/sample-application6/main.375584df9acaffbe0406.js:1
    f http://localhost:8080/sample-application6/runtime.06daa30a2963fa413676.js:1
    t http://localhost:8080/sample-application6/runtime.06daa30a2963fa413676.js:1
    r http://localhost:8080/sample-application6/runtime.06daa30a2963fa413676.js:1
    <anonymous> http://localhost:8080/sample-application6/main.375584df9acaffbe0406.js:1

Software versions:

• Browser(s): Chrome, Firefox
• Operating System: Windows
• twilio-video.js: 2.28.1
• nodejs v10.24.1
• Angular 6, 7, 8