ReactNativeCli初始化與巴貝爾TransformError

Question

HelloWorld項目生成錯誤我想通過學習下面的指令作出反應本土發展：

nvm install v4.2.6 
nvm alias default v4.2.6 
npm install -g react-native-cli 
react-native init RNApp 
cd RNAPP 

然後我打開iOS應用項目和編譯程序。然後我得到跟蹤錯誤：

... 
++ NVM_NPM_PREFIX=/Users/user/.nvm/versions/node/v4.2.6 
++ nvm_tree_contains_path /Users/user/.nvm /Users/user/.nvm/versions/node/v4.2.6 
++ '[' -n '' ']' 
+ [[ -x /Users/user/.nodenv/bin/nodenv ]] 
+ react-native bundle --entry-file index.ios.js --platform ios --dev true --bundle-output /Users/user/Library/Developer/Xcode/DerivedData/RNApp-ckxusxiznabgxxcrqessfpbjyrks/Build/Products/Debug-iphonesimulator/RNApp.app/main.jsbundle --assets-dest /Users/user/Library/Developer/Xcode/DerivedData/RNApp-ckxusxiznabgxxcrqessfpbjyrks/Build/Products/Debug-iphonesimulator/RNApp.app 
bundle: Created ReactPackager 
uncaught error Error: ReferenceError: [BABEL] /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/lib/index.js: Unknown option: /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/.babelrc.stage 
    at Logger.error (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/logger.js:41:11) 
    at OptionManager.mergeOptions (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:262:18) 
    at OptionManager.addConfig (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:221:10) 
    at OptionManager.findConfigs (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:364:16) 
    at OptionManager.init (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:412:12) 
    at File.initOptions (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/index.js:191:75) 
    at new File (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/file/index.js:122:22) 
    at Pipeline.transform (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/babel-core/lib/transformation/pipeline.js:42:16) 
    at transform (/Users/user/Desktop/RNApp/node_modules/react-native/packager/transformer.js:59:24) 
TransformError: /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/lib/index.js: [BABEL] /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/lib/index.js: Unknown option: /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/react-transform-hmr/node_modules/react-proxy/node_modules/react-deep-force-update/.babelrc.stage 
See logs /var/folders/g9/m3cmg0m10cl80xt362wpsld00000gn/T/react-packager.log 
    at SocketClient._handleMessage (SocketClient.js:139:23) 
    at BunserBuf.<anonymous> (SocketClient.js:53:42) 
    at emitOne (events.js:77:13) 
    at BunserBuf.emit (events.js:169:7) 
    at BunserBuf.process (/Users/user/Desktop/RNApp/node_modules/react-native/node_modules/bser/index.js:289:10) 
    at /Users/user/Desktop/RNApp/node_modules/react-native/node_modules/bser/index.js:244:12 
    at nextTickCallbackWith0Args (node.js:419:9) 
    at process._tickCallback (node.js:348:13) 
Command /bin/sh failed with exit code 1 

我做錯了什麼？或者只是在babel中有反應原生支持的錯誤？

➜ RNApp react-native --version 
react-native-cli: 0.1.10 
react-native: 0.18.1 

但似乎run-android是工作的罰款：

:app:generateDebugSources 
:app:processDebugJavaRes UP-TO-DATE 
:app:compileDebugJavaWithJavac 
:app:compileDebugNdk UP-TO-DATE 
:app:compileDebugSources 
:app:preDexDebug 
:app:dexDebug 
:app:validateDebugSigning 
:app:packageDebug 
:app:zipalignDebug 
:app:assembleDebug 
:app:installDebug FAILED 

FAILURE: Build failed with an exception. 

* What went wrong: 
Execution failed for task ':app:installDebug'. 
> com.android.builder.testing.api.DeviceException: No connected devices! 

Answer 1

此問題的根本原因是陣營本地使用巴貝爾6，其上不再.babelrc文件中使用stage選項，並react-deep-force-update，React Native的子依賴項仍然聲明帶有該選項的.babelrc文件。

這是任何第三方模塊的問題，它們在自己的構建過程中仍然使用舊的Babel，並且不清除npm發佈的配置文件。

我已經通過添加以下NPM運行腳本來我package JSON圍繞這一問題的工作：

"scripts": { 
    "clean:babelrc": "find ./node_modules -name react-packager -prune -o -name '.babelrc' -print | xargs rm -f", 
    "postinstall": "npm run clean:babelrc" 
} 

腳本核武器的node_modules目錄下的所有.babelrc文件每npm install後，除了react-packager目錄下的一個，這是React Native packager用來配置自己的babel規則。

問題是tracked on React Native GitHub repository。

Answer 2

我更新了npm包。

react-proxy ==> 1.1.2

react-deep-force-update ==> 2.0.1

您需要刪除軟件包第一個文件node_modules。然後安裝新版本。

它適用於我。