NativeScript / NativeScript/nativescript-cli
NativeScript Preview now fails to launch React NativeScript apps; may not be reading Webpack config.
還沒有人認領這個 Issue。
- 主要語言
- JavaScript
- 星號
- 1.1k
- 分支
- 204
- 平均合併
- 1 天 9 小時
- 30 天內合併 PR
- 8
描述
Environment
✔ Component nativescript has 6.5.0 version and is up to date.
✔ Component tns-core-modules has 6.5.1 version and is up to date.
✔ Component tns-android has 6.5.0 version and is up to date.
✔ Component tns-ios has 6.5.0 version and is up to date.
I'm using NativeScript Playground v1.8.0 and NativeScript Preview 1.30.0, which both support NativeScript 6.5.0.
This is the latest React NativeScript template (tns-template-blank-react@6.5.0), which uses NativeScript Core 6.5.0.
Describe the bug
NativeScript Preview fails to launch a freshly initialised React NativeScript app, giving the runtime error:
LOG from device Jamie Birch's iPhone: 2020-04-11 20:43:54.309 nsplaydev[285:7987] ***** Fatal JavaScript exception - application has been terminated. *****
2020-04-11 20:43:54.309 nsplaydev[285:7987] Native stack trace:
1 0x103b4e928 NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState*, JSC::Exception*, bool)
2 0x103b99058 -[TNSRuntime executeModule:referredBy:]
3 0x10391e25c -[UIApplication(PlayLiveSync) swizzled_executeModule:]
4 0x102fdf524
5 0x1975dce18 <redacted>
2020-04-11 20:43:54.310 nsplaydev[285:7987] JavaScript stack trace:
2020-04-11 20:43:54.310 nsplaydev[285:7987] anonymous(file:///app/tns_modules/react-hot-loader/index.js:3:12)
at evaluate([native code])
at moduleEvaluation([native code])
at [native code]
at asyncFunctionResume([native code])
at [native code]
at promiseReactionJob([native code])
at require([native code])
at react-hot-loader(file:///app/bundle.js:314:25)
at __webpack_require__(file:///app/runtime.js:751:34)
at fn(file:///app/runtime.js:121:39)
at file:///app/bundle.js:87:93
at ./app.ts(file:///app/bundle.js:172:34)
at __webpack_require__(file:///app/runtime.js:751:34)
at checkDeferredModules(file:///app/runtime.js:44:42)
at webpackJsonpCallback(file:///app/runtime.js:31:39)
at anonymous(file:///app/bundle.js:2:61)
at evaluate([native code])
at moduleEvaluation([native code])
at [native code]
at asyncFunctionResume([native code])
at [native code]
at promiseReactionJob([native code])
2020-04-11 20:43:54.310 nsplaydev[285:7987] JavaScript error:
file:///app/tns_modules/react-hot-loader/index.js:3:12: JS ERROR ReferenceError: Can't find variable: process
2020-04-11 20:43:54.311 nsplaydev[285:7987] PlayLiveSync: Uncaught Exception
2020-04-11 20:43:54.311 nsplaydev[285:7987] *** JavaScript call stack:
(
)
2020-04-11 20:43:54.311 nsplaydev[285:7987] *** Terminating app due to uncaught exception 'NativeScript encountered a fatal error: ReferenceError: Can't find variable: process
at
anonymous(file:///app/tns_modules/react-hot-loader/index.js:3:12)
at evaluate([native code])
at moduleEvaluation([native code])
at [native code]
at asyncFunctionResume([native code])
at [native code]
at promiseReactionJob([native code])
at require([native code])
at react-hot-loader(file:///app/bundle.js:314:25)
at __webpack_require__(file:///app/runtime.js:751:34)
at fn(file:///app/runtime.js:121:39)
at file:///app/bundle.js:87:93
at ./app.ts(file:///app/bundle.js:172:34)
at __webpack_require__(file:///app/runtime.js:751:34)
at checkDeferredModules(file:///app/runtime.js:44:42)
at webpackJsonpCallback(file:///app/runtime.js:31:39)
at anonymous(file:///app/bundle.js:2:61)
at evaluate([native code])
at moduleEvaluation([native code])
at [native code]
at asyncFunctionResume([native code])
at [native code]
at promiseReactionJob([native code])
', reason: '(null)'
*** First throw call stack:
(0x1977e896c 0x197501028 0x103b4ee00 0x103b99058 0x10391e25c 0x102fdf524 0x1975dce18)
libc++abi.dylib: terminating with uncaught exception of type NSException
2020-04-11 20:43:54.311 nsplaydev[285:7987] PlayLiveSync: Uncaught Exception
To Reproduce
# I tested this with v6.5.0 of tns-template-blank-react.
tns create rns-sanity-test --template tns-template-blank-react
cd rns-sanity-test
tns preview
Note that, by contrast, tns run ios --emulator runs this same project absolutely fine.
Expected behavior
Project should startup fine without crashing.
Sample project
Just the React NativeScript starter template, tns-template-blank-react.
Additional context
As noted above, tns run ios still works fine.
tns preview did used to work. I believe this error may have been introduced since NativeScript version 6.4.0, which introduces support for custom Webpack configs.
The error of JS ERROR ReferenceError: Can't find variable: process is entirely due to this line in my react-nativescript.webpack.config.js file being ignored (somehow) by Preview:
"process.env.NODE_ENV": JSON.stringify(production ? "production" : "development"),
react-hot-loader/index.js is trying to reference process.env.NODE_ENV, but evidently my Webpack DefinePlugin hasn't been run by Preview. I suspect that Preview is either altering the order/content of the Webpack plugins, or ignoring my react-nativescript.webpack.config.js file completely.
貢獻指南
從這裡開始
- 先讀完整個 Issue,再讀專案的貢獻指南。
- 在 Issue 下留言說明你要接手 —— 這能避免兩個人做同樣的事。
- Fork 儲存庫,在一個分支上完成修改。
- 送出 Pull Request,並在描述裡引用這個 Issue 編號。
研究方向
使用 tns create ... 和 tns preview 透過 React NativeScript 範本重現此失敗,然後與 tns run ios --emulator 進行比較。先追蹤 Preview 如何處理 react-nativescript.webpack.config.js,尤其是針對 process.env.NODE_ENV 的 DefinePlugin 項目;檢查 react-hot-loader/index.js 中造成失敗的參照。由 Preview 啟動的應用程式能在沒有 process 錯誤的情況下啟動,即表示完成。
由索引模型根據 Issue 內容生成。
評估
- 技術堆疊
- javascript, webpack
- 領域
- cli, mobile-dev
- Issue 類型
- 缺陷
- 難度
- 4/5
- 預估耗時
- 3-5 天
- 活躍度
- 停滯
- 描述清晰度
- 基本清楚
- 新手友好度
- 35/100