Livereload problem: ReferenceError: process is not defined

Hi,

I am trying to launch my Ionic 4 app in device livereload mode:

ionic cordova run android --l --c

When the is launched the inspector console shows this error:

index.js:43 Uncaught ReferenceError: global is not defined
    at Object../node_modules/node-libs-browser/node_modules/buffer/index.js (index.js:43)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/safe-buffer/index.js (index.js:2)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/randombytes/browser.js (browser.js:15)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/crypto-browserify/index.js (index.js:3)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/@auth0/cordova/src/crypto.js (crypto.js:1)
    at __webpack_require__ (bootstrap:84)

If add (window as any).global = window; to polyfills.ts file I get the next error:

Uncaught ReferenceError: Buffer is not defined
    at Object../node_modules/core-util-is/lib/util.js (util.js:103)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/readable-stream/lib/_stream_readable.js (_stream_readable.js:67)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/readable-stream/readable-browser.js (readable-browser.js:1)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/stream-browserify/index.js (index.js:28)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/hash-base/index.js (index.js:3)
    at __webpack_require__ (bootstrap:84)

If add window.Buffer = window.Buffer || require('buffer').Buffer; to polyfills.ts file I get the next error:

Uncaught ReferenceError: process is not defined
    at Object../node_modules/readable-stream/lib/_stream_writable.js (_stream_writable.js:57)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/readable-stream/readable-browser.js (readable-browser.js:4)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/stream-browserify/index.js (index.js:28)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/hash-base/index.js (index.js:3)
    at __webpack_require__ (bootstrap:84)
    at Object../node_modules/md5.js/index.js (index.js:3)
    at __webpack_require__ (bootstrap:84)

If I launch the app without livereload it works fine. ¿Can someone help me?

This is my Ionic info:

Ionic:

   Ionic CLI                     : 6.1.0 (/usr/local/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 4.11.10
   @angular-devkit/build-angular : 0.803.25
   @angular-devkit/schematics    : 8.1.3
   @angular/cli                  : 8.3.25
   @ionic/angular-toolkit        : 2.2.0

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.1.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 9 other plugins)

Utility:

   cordova-res : 0.9.0
   native-run  : 0.3.0

System:

   Android SDK Tools : 26.1.1 (/Users/myuser/Library/Android/sdk)
   ios-deploy        : 1.10.0
   ios-sim           : 6.1.2
   NodeJS            : v10.16.1 (/usr/local/bin/node)
   npm               : 6.9.0
   OS                : macOS Catalina
   Xcode             : Xcode 11.3.1 Build version 11C504

Thanks

You seem to have added a dependency that expects to be running under Node.js. Not everything runs in a browser.

This is my package.json, some idea what would be causing the problem?

{
“name”: “myappname”,
“version”: “0.0.1”,
“author”: “Ionic Framework”,
“homepage”: “https://ionicframework.com/”,
“scripts”: {
“ng”: “ng”,
“start”: “ng serve”,
“build”: “ng build”,
“test”: “ng test”,
“lint”: “ng lint”,
“e2e”: “ng e2e”
},
“private”: true,
“dependencies”: {
@angular-devkit/build-angular”: “^0.803.17”,
@angular/common”: “~8.2.13”,
@angular/compiler”: “~8.2.13”,
@angular/core”: “~8.2.13”,
@angular/forms”: “~8.2.13”,
@angular/platform-browser”: “~8.2.13”,
@angular/platform-browser-dynamic”: “~8.2.13”,
@angular/router”: “~8.2.13”,
@auth0/cordova”: “^0.4.0”,
@ionic-native/core”: “^5.16.0”,
@ionic-native/in-app-browser”: “^5.16.0”,
@ionic-native/safari-view-controller”: “^5.17.0”,
@ionic-native/social-sharing”: “^5.19.1”,
@ionic-native/splash-screen”: “^5.16.0”,
@ionic-native/status-bar”: “^5.16.0”,
@ionic-native/stripe”: “^5.18.0”,
@ionic/angular”: “^4.11.3”,
@ionic/storage”: “^2.2.0”,
@ngx-translate/core”: “^11.0.1”,
@ngx-translate/http-loader”: “^4.0.0”,
“auth0-js”: “^9.11.3”,
“buffer”: “^5.4.3”,
“cordova-android”: “^8.1.0”,
“cordova-plugin-customurlscheme”: “^4.4.0”,
“cordova-plugin-device”: “^2.0.3”,
“cordova-plugin-inappbrowser”: “^3.2.0”,
“cordova-plugin-ionic-keyboard”: “^2.2.0”,
“cordova-plugin-ionic-webview”: “^4.1.3”,
“cordova-plugin-safariviewcontroller”: “^1.6.0”,
“cordova-plugin-splashscreen”: “^5.0.3”,
“cordova-plugin-statusbar”: “^2.4.3”,
“cordova-plugin-stripe”: “^1.5.3”,
“cordova-plugin-whitelist”: “^1.3.4”,
“cordova-plugin-x-socialsharing”: “^5.6.4”,
“core-js”: “^2.5.4”,
“es6-promise-plugin”: “^4.2.2”,
“rxjs”: “~6.5.1”,
“tslib”: “^1.9.0”,
“zone.js”: “~0.9.1”
},
“devDependencies”: {
@angular-builders/custom-webpack”: “^8.4.0”,
@angular-devkit/architect”: “~0.801.2”,
@angular-devkit/core”: “~8.1.2”,
@angular-devkit/schematics”: “~8.1.2”,
@angular/cli”: “~8.3.17”,
@angular/compiler-cli”: “~8.2.13”,
@angular/language-service”: “~8.2.13”,
@ionic/angular-toolkit”: “^2.1.1”,
@types/jasmine”: “~3.3.8”,
@types/jasminewd2”: “~2.0.3”,
@types/node”: “~8.9.4”,
“codelyzer”: “^5.2.0”,
“jasmine-core”: “~3.4.0”,
“jasmine-spec-reporter”: “~4.2.1”,
“karma”: “~4.1.0”,
“karma-chrome-launcher”: “~2.2.0”,
“karma-coverage-istanbul-reporter”: “~2.0.1”,
“karma-jasmine”: “~2.0.1”,
“karma-jasmine-html-reporter”: “^1.4.0”,
“protractor”: “~5.4.0”,
“ts-node”: “~7.0.0”,
“tslint”: “~5.15.0”,
“typescript”: “~3.5.3”
},
“description”: “An Ionic project”,
“cordova”: {
“plugins”: {
“cordova-plugin-whitelist”: {},
“cordova-plugin-statusbar”: {},
“cordova-plugin-device”: {},
“cordova-plugin-splashscreen”: {},
“cordova-plugin-ionic-webview”: {
“ANDROID_SUPPORT_ANNOTATIONS_VERSION”: “27.+”
},
“cordova-plugin-ionic-keyboard”: {},
“cordova-plugin-safariviewcontroller”: {},
“cordova-plugin-customurlscheme”: {
“URL_SCHEME”: “mybundleid”,
“ANDROID_SCHEME”: “mybundleid”,
“ANDROID_HOST”: “YOUR_DOMAIN”,
“ANDROID_PATHPREFIX”: “/cordova/mybundleid/callback”
},
“cordova-plugin-inappbrowser”: {},
“cordova-plugin-stripe”: {},
“cordova-plugin-x-socialsharing”: {
“ANDROID_SUPPORT_V4_VERSION”: “24.1.1+”
}
},
“platforms”: [
“android”
]
}
}

thanks

@Hanzo I have the excat same problem - did you find any reason/solution yet?
What we have in common that we both use auth0 here.

So, after some investigation it seems that the custom webpack is not used while using the livereload function (see https://auth0.com/docs/quickstart/native/ionic4/01-login#install-the-dependencies ) which does enable a polyfill for the crypto library.
I did not find a solution yet how to change the config in the angular.json to solve this issue.