twilio / twilio-client.js

Twilio’s Programmable Voice JavaScript SDK
https://www.twilio.com/docs/voice/client/javascript
Other
67 stars 32 forks source link

[BUG] Uncaught ReferenceError: process is not defined in REACT #307

Closed elenitaex5 closed 1 year ago

elenitaex5 commented 1 year ago

Hi, I'm experimenting this issue in my React project. There's something similar in ANGULAR and an issue related with that. But their solution doesn't work in React.

My package.json has this package versions

"webpack": "5.75.0",
"webpack-cli": "^3.3.12",
 "webpack-dev-server": "^3.11.0",
 "twilio-client": "^1.14.0",

and my envs are wellformed. In my webpack.config.json dotenv is right initialized. Including console.log('env', process.env) with my env vars inside webpack.config.json my env vars are filled and custom env right setted. Console are showing a list of env vars, but this code inside node_modules/util/utils.js is breaking my app and is twilio-voice fault:

if (process.env.NODE_DEBUG) {
  var debugEnv = process.env.NODE_DEBUG;
  debugEnv = debugEnv.replace(/[|\\{}()[\]^$+?.]/g, '\\$&')
    .replace(/\*/g, '.*')
    .replace(/,/g, '$|^')
    .toUpperCase();
  debugEnvRegex = new RegExp('^' + debugEnv + '$', 'i');
}

First if is breaking my app. I think the problem is same as people are experimenting in Angular, but I don't know how can we solve it in React.

Code to reproduce the issue:

Only install it in React project having dependencies included above. Starting the server with npm run serve and go to localhost:8080 is showing the error.

Expected behavior:

No errors initializing the app.

Actual behavior:

image

This error appears initializing the web.

Software versions:

elenitaex5 commented 1 year ago

Problem is caused by util library dependency. It crushes with WEBPACK 5

I've found the real solution. Real solution is here https://github.com/browserify/node-util/issues/57#issuecomment-764436352

And no file has to be changed except webpack.config.js once