babel / babel/minify

ReactNativeJS: ReferenceError: Can't find variable: error

Open
#1,004 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
4.4k
Forks
217
PR merge metrics
No merged PRs in 30d

Description

**Describe the bug**

Using `transform-remove-console` triggers `ReactNativeJS: ReferenceError: Can't find variable: error` only on production build

**To Reproduce**
My babel.config.js file:
```
const plugins = ["react-native-paper/babel"];
if (process.env.NODE_ENV === "production") {
plugins.push(["transform-remove-console"]);
}

module.exports = {
presets: ["module:metro-react-native-babel-preset"],
plugins: plugins
};

```

**Actual Output**

This produces the following error when the app opens:
```
ReactNative: ReactInstanceManager.createReactContext()
ReactNative: Initializing React Xplat Bridge.
ReactNative: Initializing React Xplat Bridge before initializeBridge
ReactNative: Initializing React Xplat Bridge after initializeBridge
ReactNative: CatalystInstanceImpl.runJSBundle()
ReactNative: ReactInstanceManager.setupReactContext()
ReactNative: CatalystInstanceImpl.initialize()
E/AndroidRuntime: FATAL EXCEPTION: mqt_native_modules
Process: com.kinvent.kforce, PID: 25576
com.facebook.react.common.JavascriptException: ReferenceError: Can't find variable: error, stack:
@25:117
v@2:1474
@19:205
v@2:1474
@14:167
v@2:1474
@13:253
v@2:1474
@12:145
v@2:1474
@8:126
v@2:1474
@6:44
v@2:1474
d@2:876
global code@3143:4

at com.facebook.react.modules.core.ExceptionsManagerModule.reportException(ExceptionsManagerModule.java:71)
at java.lang.reflect.Method.invoke(Native Method)
at com.facebook.react.bridge.JavaMethodWrapper.invoke(JavaMethodWrapper.java:371)
at com.facebook.react.bridge.JavaModuleWrapper.invoke(JavaModuleWrapper.java:150)
at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method)
at android.os.Handler.handleCallback(Handler.java:883)
at android.os.Handler.dispatchMessage(Handler.java:100)
at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:26)
at android.os.Looper.loop(Looper.java:224)
at com.facebook.react.bridge.queue.MessageQueueThreadImpl$4.run(MessageQueueThreadImpl.java:225)
at java.lang.Thread.run(Thread.java:919)

```
and then the app crashes immediately.

This is not happening on development build if i add the same transform plugin in development mode.
Also, this is not happening when i add `{ exclude: ["error", "warn"] }` options to the transform plugin

**My package.json file:**
```
{
"name": "...",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"@react-native-community/async-storage": "^1.9.0",
"@react-native-community/datetimepicker": "^3.0.9",
"@react-native-community/image-editor": "^2.2.0",
"@react-native-community/netinfo": "^6.0.0",
"@react-native-community/viewpager": "^3.3.0",
"@react-native-firebase/app": "^8.4.5",
"@react-native-firebase/crashlytics": "^8.4.8",
"@types/base-64": "^0.1.0",
"@types/bytebuffer": "^5.0.40",
"@types/jest": "^24.0.18",
"@types/react": "^16.9.4",
"@types/react-native": "^0.60.17",
"@types/react-native-material-dropdown": "^0.11.1",
"@types/react-native-snap-carousel": "^3.8.1",
"@types/react-redux": "^7.1.5",
"@types/react-test-renderer": "^16.9.0",
"array-flat-polyfill": "^1.0.1",
"axios": "^0.17.1",
"base-64": "^0.1.0",
"buffer": "^5.4.3",
"date-fns": "^2.8.1",
"immutability-helper": "^3.0.1",
"lodash": "^4.17.15",
"pdf-lib": "^1.3.1",
"react": "16.9.0",
"react-native": "0.61.2",
"react-native-android-keyboard-adjust": "^1.2.0",
"react-native-android-location-enabler": "^1.2.0",
"react-native-big-calendar": "^0.7.5",
"react-native-ble-plx": "^1.1.0",
"react-native-bluetooth-state-manager": "^1.1.0",
"react-native-calendars": "1.1254.0",
"react-native-card-list": "^0.1.0",
"react-native-charts-wrapper": "git+https://github.com/angelos3lex/react-native-charts-wrapper.git",
"react-native-country-picker-modal": "^2.0.0",
"react-native-draggable-flatlist": "^2.3.1",
"react-native-elements": "^2.3.2",
"react-native-file-viewer": "^2.0.1",
"react-native-fs": "^2.16.2",
"react-native-gesture-handler": "^1.6.1",
"react-native-image-picker": "^2.3.1",
"react-native-image-size": "^1.1.3",
"react-native-keyboard-aware-scroll-view": "^0.9.1",
"react-native-localization": "^2.1.6",
"react-native-material-dropdown": "^0.11.1",
"react-native-mime-types": "^2.3.0",
"react-native-navigation": "6.12.0",
"react-native-paper": "^3.9.0",
"react-native-permissions": "^2.0.9",
"react-native-reanimated": "^1.7.0",
"react-native-restart": "0.0.17",
"react-native-sha1": "^1.2.3",
"react-native-smart-gesture-password-angeloslex": "^2.1.7",
"react-native-snap-carousel": "^3.9.0",
"react-native-sound": "^0.11.0",
"react-native-svg": "^9.13.3",
"react-native-svg-transformer": "^0.14.2",
"react-native-vector-icons": "7.1.0",
"react-native-version-info": "^1.0.1",
"react-native-view-shot": "^3.1.2",
"react-native-webview": "^8.0.3",
"react-redux": "^7.1.1",
"react-zlib-js": "^1.0.4",
"realm": "^3.6.4",
"redux": "^4.0.4",
"rn-secure-storage": "^2.0.4",
"rxjs": "^6.5.3",
"ts-optchain": "^0.1.8",
"typescript": "^3.6.3",
"uuid": "^3.3.3"
},
"devDependencies": {
"@babel/core": "^7.6.2",
"@babel/runtime": "^7.7.4",
"@bam.tech/react-native-make": "^1.0.3",
"@react-native-community/eslint-config": "^0.0.5",
"@types/lodash": "^4.14.168",
"@types/react-native-calendars": "^1.505.0",
"@types/react-native-charts-wrapper": "^0.5.1",
"axios-logger": "^2.3.1",
"babel-jest": "^24.9.0",
"babel-plugin-transform-remove-console": "^6.9.4",
"eslint": "^6.5.1",
"jest": "^24.9.0",
"metro-react-native-babel-preset": "^0.56.0",
"react-test-renderer": "16.9.0"
},
"jest": {
"preset": "react-native"
},
"prettier": {
"printWidth": 140,
"tabWidth": 4
}
}

```

Contributor guide

Open the contributing guide

Research direction

Start with the reported babel.config.js configuration and reproduce the production build using transform-remove-console, comparing it with development and with the error/warn exclusions. Done means the production app opens without the reported ReferenceError while the intended console removal behavior remains intact.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react-native
Domain
build-system
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.