èŠæ±ããããã¹ãŠã®æ å ±ãæäŸããŠãã ããã ãã®åœ¢åŒã«åŸããªãåé¡ã¯åæ¢ããå¯èœæ§ããããŸãã
ãã°ãäœã§ããããæ確ãã€ç°¡æœã«èª¬æããŠãã ããã å¿
èŠã«å¿ããŠã¹ã¯ãªãŒã³ã·ã§ãããå«ããŸãã
ææ°ã®ReactNativeãªãªãŒã¹ã䜿çšããŠãã¹ãããåé¡ããŸã ä¿®æ£ãããŠããªãããšã確èªããŠãã ããïŒ https ïŒ
npx react-native info
info Fetching system and libraries information...
System:
OS: macOS 10.15.4
CPU: (12) x64 Intel(R) Core(TM) i9-8950HK CPU @ 2.90GHz
Memory: 43.02 MB / 32.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 14.1.0 - /usr/local/bin/node
Yarn: 1.10.1 - /usr/local/bin/yarn
npm: 6.14.4 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.9.1 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: iOS 13.4, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
Android SDK:
API Levels: 26, 27, 28, 29
Build Tools: 26.0.2, 27.0.3, 28.0.3, 29.0.1, 29.0.2
System Images: android-23 | Google APIs Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom, android-29 | Google Play Intel x86 Atom
Android NDK: Not Found
IDEs:
Android Studio: 3.6 AI-192.7142.36.36.6392135
Xcode: 11.4.1/11E503a - /usr/bin/xcodebuild
Languages:
Java: 1.8.0_211 - /usr/bin/javac
Python: 2.7.17 - /usr/local/bin/python
npmPackages:
@react-native-community/cli: Not Found
react: 16.11.0 => 16.11.0
react-native: 0.62.2 => 0.62.2
npmGlobalPackages:
*react-native*: Not Found
åé¡ãåçŸããæé ã®è©³çŽ°ãªãªã¹ããæäŸããŸãã
npx react-native init Blah --template react-native-template-typescript
å®è¡ããŸãnpx react-native start
å®è¡ããŸãnpx react-native run-android
å®è¡ããŸãError: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639.js` from ``:
None of these files exist:
* debugger-ui/debuggerWorker.cff11639.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
* debugger-ui/debuggerWorker.cff11639.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
at ModuleResolver.resolveDependency (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
at ResolutionRequest.resolveDependency (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
at /Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/lib/transformHelpers.js:267:42
at Server.<anonymous> (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/Server.js:841:41)
at Generator.next (<anonymous>)
at asyncGeneratorStep (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/Server.js:99:24)
at _next (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/Server.js:119:9)
ãã®ãšã©ãŒã¯çºçããŸããã
ãããã°ã¢ãŒãã§å®è¡ããå Žåã«ãåãåé¡ãçºçããŸãã
åãåé¡ãreact-nativeãïŒã0.62.2ãã
åãåé¡ãreact-nativeãïŒã0.62.2ãã
åã
åãåé¡ã
ç§ã®ReactããŒãžã§ã³ïŒ
"react"ïŒ "16.11.0"ã
"react-native"ïŒ "0.62.2"
解決çã¯ãããŸããïŒ
react-native-config
ã®äœãã ãšæããŸãã ç§ã¯ããã§åãåé¡ãæ±ããŠããŸãïŒ
"react": "16.11.0",
"react-native": "0.62.2",
"react-native-config": "^1.2.0",
@jmlavoieråãåé¡ããããŸããã react-native-config
ã¯äœ¿çšããªãã§ãã ããã
"react": "16.11.0",
"react-native": "0.62.2",
åãåé¡ãreact-nativeãïŒã0.62.2ãã
åã
https://reactnavigation.org/docs/troubleshooting/#app -is-not-working-properly-when-connected-to-chrome-debugger
ç§ã¯åãåé¡ãæ±ããŠããŸãïŒ
"react": "16.11.0",
"react-native": "0.62.2",
@imamrobaniãªã³ã¯ãããããšãã ããããããã¯åé¡ã«å¯ŸåŠããŠããŸãããïŒ
ãã®åé¡ã¯Chromeã«é¢é£ããŠããå¯èœæ§ããããŸãã ããããReact-Nativeã®ä»¥åã®ããŒãžã§ã³ã«ã¯ãããŸããã§ããã
ããã§ãåãã§ãããä»å€ã¯æ©èœããªããªã£ãã®ã¯å¥åŠã§ãã
å°ãªããšãAndroidããã€ã¹ã§ã¯ãonPressã䜿çšããŠTouchableOpacityã³ã³ããŒãã³ããæŒãããšã¯èš±å¯ãããŠããŸããã åããŠæ©èœããããã§ããã¢ããªã®æäœã®äžéšã¯äžåºŠã¯æ©èœããŸããããã®åŸã¯æ©èœããªããªããŸãã
⯠react-native info
info Fetching system and libraries information...
System:
OS: macOS 10.15.3
CPU: (8) x64 Intel(R) Core(TM) i5-8257U CPU @ 1.40GHz
Memory: 17.99 MB / 8.00 GB
Shell: 5.7.1 - /bin/zsh
Binaries:
Node: 13.7.0 - ~/.nvm/versions/node/v13.7.0/bin/node
Yarn: 1.21.1 - /usr/local/bin/yarn
npm: 6.13.6 - ~/.nvm/versions/node/v13.7.0/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.9.1 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: iOS 13.2, DriverKit 19.0, macOS 10.15, tvOS 13.2, watchOS 6.1
Android SDK:
API Levels: 27, 28
Build Tools: 27.0.3, 28.0.3
Android NDK: Not Found
IDEs:
Android Studio: Not Found
Xcode: 11.3.1/11C504 - /usr/bin/xcodebuild
Languages:
Java: 1.8.0_231 - /usr/bin/javac
Python: 2.7.16 - /usr/bin/python
npmPackages:
@react-native-community/cli: Not Found
react: 16.11.0 => 16.11.0
react-native: 0.62.2 => 0.62.2
npmGlobalPackages:
*react-native*: Not Found
ããã€ã¹ããã¢ããªãå®å šã«ã¢ã³ã€ã³ã¹ããŒã«ããŸãããããšã©ãŒãªãã§åäœããããã«ãªããŸããð€ïŒAndroidããã€ã¹ïŒ
@imamrobaniãªã³ã¯ãããããšãã ããããããã¯åé¡ã«å¯ŸåŠããŠããŸãããïŒ
ãã®åé¡ã¯Chromeã«é¢é£ããŠããå¯èœæ§ããããŸãã ããããReact-Nativeã®ä»¥åã®ããŒãžã§ã³ã«ã¯ãããŸããã§ããã
ç§ã®å Žåã¯
"react"ïŒ "16.11.0"ã
"react-native"ïŒ "0.62.2"ã
"react-navigation"ïŒ "^ 4.0.10"
åé¡ã¯ãå®éã®ããã€ã¹ããããã°ã¢ãŒãã§äœ¿çšãããšãã¢ããªãå¥ã®ç»é¢ã«ç§»åã§ããªãããšã§ãã ãããããšãã¥ã¬ãŒã¿ã䜿çšããå Žåã¯æ£åžžã«å®è¡ãããŠããŸãã
誰ããåé¡ãã©ãã«ãããç¥ã£ãŠããŸããïŒ
以åã¯reactnative0.61ãåé¡ãªã䜿çšããŠããŸãã
ã¡ãããã³ãã©ãŒã«ãã°ã衚瀺ãããŠãããšãã«ããããã°ãbashããchromeã«åãæ¿ãããã³ã«çºçããrnã¡ãã¥ãŒã§debug
ãã¯ãªãã¯ããŸãã
ç·šéïŒ
åºæ¬çã«ã¯ãã¯ãã ã§ã¯ãªã
ã¡ãã¥ãŒããã¢ããªããããã°ã¢ãŒãã«èšå®ãããšãJavaScriptãã°ããã©ãŠã¶ã³ã³ãœãŒã«ã«éããããšãã«ããã®ãšã©ãŒãçºçããŸã
Error: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639.js` from ``:
None of these files exist:
* debugger-ui/debuggerWorker.cff11639.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
* debugger-ui/debuggerWorker.cff11639.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
at ModuleResolver.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
at ResolutionRequest.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
at /Users/henriquederosa/dev/myapp/node_modules/metro/src/lib/transformHelpers.js:267:42
at Server.<anonymous> (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:841:41)
at Generator.next (<anonymous>)
at asyncGeneratorStep (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:99:24)
at _next (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:119:9
ã¡ãããã³ãã©ãŒã«ãã°ã衚瀺ãããŠãããšãã«ããããã°ãbashããchromeã«åãæ¿ãããã³ã«çºçããrnã¡ãã¥ãŒã§
debug
ãã¯ãªãã¯ããŸããç·šéïŒ
åºæ¬çã«ã¯ãã¯ãã ã§ã¯ãªã
ã¡ãã¥ãŒããã¢ããªããããã°ã¢ãŒãã«èšå®ãããšãJavaScriptãã°ããã©ãŠã¶ã³ã³ãœãŒã«ã«éããããšãã«ããã®ãšã©ãŒãçºçããŸãError: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639.js` from ``: None of these files exist: * debugger-ui/debuggerWorker.cff11639.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx) * debugger-ui/debuggerWorker.cff11639.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx) at ModuleResolver.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15) at ResolutionRequest.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18) at DependencyGraph.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph.js:287:16) at /Users/henriquederosa/dev/myapp/node_modules/metro/src/lib/transformHelpers.js:267:42 at Server.<anonymous> (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:841:41) at Generator.next (<anonymous>) at asyncGeneratorStep (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:99:24) at _next (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:119:9
ã¯ãããŸã£ããåãã§ããã¢ã³ã€ã³ã¹ããŒã«ããŠå床ã€ã³ã¹ããŒã«ããŸãããããããã°ã¢ãŒãã§ãåãã§ãã
ããã§ãåãã§ãããä»å€ã¯æ©èœããªããªã£ãã®ã¯å¥åŠã§ãã
å°ãªããšãAndroidããã€ã¹ã§ã¯ãonPressã䜿çšããŠTouchableOpacityã³ã³ããŒãã³ããæŒãããšã¯èš±å¯ãããŠããŸããã åããŠæ©èœããããã§ããã¢ããªã®æäœã®äžéšã¯äžåºŠã¯æ©èœããŸããããã®åŸã¯æ©èœããªããªããŸãã `` `ããã«ã¡ã¯@HenriqueDerosa ããã®åé¡ã確èªããŠãã ãã-ãããã°æã«Androidããã€ã¹ã§çºçããŠããåé¡ãšäŒŒãŠããŸããïŒ
https://github.com/facebook/react-native/issues/29083#issuecomment -642457919
ããã¿ããªãç§ã¯ãã®åé¡ãæ±ããŠããŸããããããŠç§ã®ããã«åããã®ã¯ã¡ããã©ç§ã®ã°ãŒã°ã«ã¯ããŒã ãã£ãã·ã¥ãã¯ãªã¢ããããšã§ããã
ãããŠããåäœããããšã¯ãã·ãã¥ã¬ãŒã¿ãŒã«èµ€ããšã©ãŒç»é¢ã衚瀺ããããéåžžã©ããéçºãç¶è¡ã§ããããšãæå³ããŸãã
ããã«å¯Ÿãã解決çã¯ãããŸããïŒ ã¢ããªã±ãŒã·ã§ã³ããããã°ã§ããŸããã ãã¬ãŒã¯ãã€ã³ãããããããŠããŸãã
ããã«å¯Ÿãã解決çã¯ãããŸããïŒ æ°ãããããžã§ã¯ããäœæããå Žåã§ããReact Native0.62.2ã§çºçããããã§ãã ãããã¬ãŒãèŠããšãäœããã®çç±ã§ãšã©ãŒ500ãçºçããŠããŸãã
ããã«å¯Ÿãã解決çã¯ãããŸããïŒ æ°ãããããžã§ã¯ããäœæããå Žåã§ããReact Native0.62.2ã§çºçããããã§ãã ãããã¬ãŒãèŠããšãäœããã®çç±ã§ãšã©ãŒ500ãçºçããŠããŸãã
ã¹ãããããã ãã§ãã¢ããªã±ãŒã·ã§ã³ãšã©ãŒãçºçããªãéãåé¡ãããŸããã
ãããçºçãããšãããŒããŒãã衚瀺ãããªããããããã¹ããã£ãŒã«ãã«ããã¹ããå ¥åã§ããªããªããŸãã ãããã¬ãŒã䜿çšã§ããªããªããã¢ããªã±ãŒã·ã§ã³ã«ãã°ã€ã³ã§ããªããªããŸãã
ãããçºçãããšãããŒããŒãã衚瀺ãããªããããããã¹ããã£ãŒã«ãã«ããã¹ããå ¥åã§ããªããªããŸãã ãããã¬ãŒã䜿çšã§ããªããªããã¢ããªã±ãŒã·ã§ã³ã«ãã°ã€ã³ã§ããªããªããŸãã
ãšãã¥ã¬ãŒã¿ã§è©ŠããŠã¿ãŠãã ãã
ãããçºçãããšãããŒããŒãã衚瀺ãããªããããããã¹ããã£ãŒã«ãã«ããã¹ããå ¥åã§ããªããªããŸãã ãããã¬ãŒã䜿çšã§ããªããªããã¢ããªã±ãŒã·ã§ã³ã«ãã°ã€ã³ã§ããªããªããŸãã
ãšãã¥ã¬ãŒã¿ã§è©ŠããŠã¿ãŠãã ãã
ãšãã¥ã¬ãŒã¿ãŒã§ã¯æ©èœããŠããŸãããããã§ããã³ãã©ãŒã§ãšã©ãŒãã¹ããŒãããŸãã ããã€ã¹ã®ãããã°ã®ã¿ã«åœ±é¿ããã®ã¯ãªãã§ããïŒ
ãããçºçãããšãããŒããŒãã衚瀺ãããªããããããã¹ããã£ãŒã«ãã«ããã¹ããå ¥åã§ããªããªããŸãã ãããã¬ãŒã䜿çšã§ããªããªããã¢ããªã±ãŒã·ã§ã³ã«ãã°ã€ã³ã§ããªããªããŸãã
ãšãã¥ã¬ãŒã¿ã§è©ŠããŠã¿ãŠãã ãã
ãšãã¥ã¬ãŒã¿ãŒã§ã¯æ©èœããŠããŸãããããã§ããã³ãã©ãŒã§ãšã©ãŒãã¹ããŒãããŸãã ããã€ã¹ã®ãããã°ã®ã¿ã«åœ±é¿ããã®ã¯ãªãã§ããïŒ
å®éã®ããã€ã¹ïŒAndroid 9ïŒã䜿çšãããšæ©èœããªããªããããã€ã¹ãandroid 9ã®äžã«å€æŽããŸããç§ã®å ŽåãAndroid6ã䜿çšããŸãã
ãããçºçãããšãããŒããŒãã衚瀺ãããªããããããã¹ããã£ãŒã«ãã«ããã¹ããå ¥åã§ããªããªããŸãã ãããã¬ãŒã䜿çšã§ããªããªããã¢ããªã±ãŒã·ã§ã³ã«ãã°ã€ã³ã§ããªããªããŸãã
ãšãã¥ã¬ãŒã¿ã§è©ŠããŠã¿ãŠãã ãã
ãšãã¥ã¬ãŒã¿ãŒã§ã¯æ©èœããŠããŸãããããã§ããã³ãã©ãŒã§ãšã©ãŒãã¹ããŒãããŸãã ããã€ã¹ã®ãããã°ã®ã¿ã«åœ±é¿ããã®ã¯ãªãã§ããïŒ
å®éã®ããã€ã¹ïŒAndroid 9ïŒã䜿çšãããšæ©èœããªããªããããã€ã¹ãandroid 9ã®äžã«å€æŽããŸããç§ã®å ŽåãAndroid6ã䜿çšããŸãã
ãšãã¥ã¬ãŒããããããã€ã¹ãandroid6 APIã«å€æŽãããããããã°ã«å€ãããã€ã¹ã䜿çšãããšããããšã§ããïŒ ããã«ãããããããããã¯èµ·ãããªãã¯ãã§ããããããã¬ãŒã¯æ°ããããã€ã¹ã§ãåäœããã¯ãã§ã...
Chromeã®Reactãããã¬ãŒã¿ããããŒããªãã¬ãã·ã¥ïŒshift + refreshïŒããã€ã³ã¹ãã¯ã¿ãŒã§ã¢ããªã±ãŒã·ã§ã³ããŒã¿ãã¯ãªã¢ããæåŸã«bashã§ã¡ã€ã³ãã³ãã©ãŒã¹ã¬ãããåèµ·åããããšã§è§£æ±ºããŸããïŒnpm startïŒ
ããã§ãåãåé¡ããããŸãã ãããã°ã¢ãŒããã¢ã¯ãã£ãã«ãªããšããã«ãã¢ããªã¯ãã¹ãŠã®onPress()
ã€ãã³ãã®ç»é²ãåæ¢ããããã§ãã ã¹ã¯ããŒã«ã¯åŒãç¶ãå¯èœã§ãã
ãã®åé¡ã¯ãšãã¥ã¬ãŒã¿ãŒå ã§ã¯çºçããŸããã ãã ããã³ã³ãœãŒã«ãšã¿ãŒããã«ïŒreactãµãŒããŒïŒã«ãåããšã©ãŒã衚瀺ãããŸãã
react-native -v
ã¯æ»ããŸã
react-native-cli: 2.0.1
react-native: 0.62.2
ç§ããã®åé¡ãæ±ããŠããŸãã çããé«äœã§æ€çŽ¢ããŸãã
åºåãããã«ãŒãç¡å¹ã«ãããšãäœããã®çç±ã§ã³ã³ãœãŒã«ã§ããå€ãã®ãã£ãŒãããã¯ãåŸãããŸããã
ãããŠãchromeãã¡ã€ã³ã¹ã¬ããããããã°ããŠããããšã«æ°ã¥ããŸããã èŠèœãšããã¡ã§ãã
debugWorkerã¹ã¬ãããã¯ãªãã¯ããåŸãã¢ããªã¯ãã¬ãŒã¯ãã€ã³ãã®ç»é²ãšããããéå§ããŸãã...
ãããããªãã®äœäººããå©ããŠãããããšãé¡ã£ãŠããŸãð
"react"ïŒ "16.11.0"ã
"react-native"ïŒ "0.62.2"ã
ç§ã¯åãåé¡ãæ±ããŠããŸãïŒ
ããããšã@ HenriqueDerosa -Expoã¢ããªãå®å šã«ã¢ã³ã€ã³ã¹ããŒã«ããŠåã€ã³ã¹ããŒã«ããããšãç§ã«ãšã£ãŠã¯
èå³æ·±ãããšã«ãSDK 36ãã38ã«ã¢ããã°ã¬ãŒãããexpo-cliãã¢ããã°ã¬ãŒãããŸããã ãããã£ãŠãäž¡æ¹ãåæã«ç§»è¡ããããšã«ã¯åé¡ãããå¯èœæ§ããããŸãã ãŸããååã®ã¢ããªã®ã€ã³ã¹ããŒã«ã§ããããã¡ã€ã«ã®ãªã¢ãŒããããã°ãããã©ã«ãã§èªåçã«æå¹ã«ãªã£ãŠãããšæããŸãã æåã¯ç¡å¹ã«ããŠããåŸã§æå¹ã«ããŠãåé¡ãªãã®ã§ã¯ãªãã§ããããïŒ ãããã«ãããããªãã®ãããã«æè¬ããŸãïŒ
å é±ãåãåé¡ã§ãã éçºã§ããŸããã ä¿¡ããããªãã»ã©ã€ã©ã€ã©ããã ããã¯ãã¢ããã°ã¬ãŒããè¡ãããŒã ãææ¡ããå¿ èŠããããŸãã
"react"ïŒ "ã16.11.0"ã
"react-dom"ïŒ "ã16.11.0"ã
"react-native"ïŒ " https://github.com/expo/react-native/archive/sdk-38.0.1.tar.gz "ã
ããã§ãåãã§ãã·ãã¥ã¬ãŒã¿ãŒã¯èªåæŽæ°ãããŸã
ç§ã«ãšã£ãŠïŒreact-native-meteorã®åé¡-æ£ç¢ºã«ã¯ããeventemitter3ãããŒãã¢ãžã¥ãŒã«ã¯setMaxListenersãåé€ããŸãã
é£çµ¡ãã£ãïŒ ç§ã¯åãåé¡ãæ±ããŠããŸã
å®éã®iOSããã€ã¹ã§Chromeãããã¬ãŒã䜿çšããŠããŸããããã¹ãŠã®Chromeæ¡åŒµæ©èœãç¡å¹ã«ããããšã§ä¿®æ£ã§ããããã§ã...ãã®ãã¡ã®1ã€ãå¹²æžããŠããå¯èœæ§ããããŸãã ãããã°äžã«ãšã©ãŒã衚瀺ãããªããªã£ãããã¿ãããå¿çããªããªã£ããããŸãã
@chadwhittaker確ãã«ãChromeããRedux Toolsãåé€ãããšãã¿ãããåã³æ©èœããããã«ãªããŸããã ãã®æ¡åŒµæ©èœã«é¢é£ããŠããå¯èœæ§ããããŸãã
誰ãããŸã 解決çãèŠã€ããŸãããïŒ ããã¯ã°ãããŠããŸã....æåéããã¹ãŠãè©ŠããŸãããããŸã ããã«ãããŸã
解決çã¯ããã·ã³ã®æ¥ä»ãšæå»ïŒiOSã®å ŽåïŒãšãšãã¥ã¬ãŒã¿ãŒïŒAndroidã®å ŽåïŒãäœæããããšã§ãã ãããšåããšã©ãŒãçºçããã³ã³ãœãŒã«ã«**Debugger and device times have drifted by more than 60s. Please correct this by running adb shell "date
date +ïŒ
mïŒ
dïŒ
HïŒ
MïŒ
YãïŒ
S " on your debugger machine.**
ãšãã¥ã¬ãŒã¿ã®æ¥ä»ãšæå»ãæŽæ°ããåŸãããã¯åäœããŸãã
@zenkhasã¯ããå°ãªããšããšãã¥ã¬ãŒã¿ãŒã§ã¯ãæ¥ä»ãšæå»ã調æŽããªããŠãæ£ããæ©èœããŸãããéçºç®çã§ç©çããã€ã¹ã䜿çšããããšãéèŠãªå ŽåããããŸãã
ãããŸã§ãããŒãã¢ãžã¥ãŒã«ãããã£ãŠããã¹ãŠã®ã¿ã€ãã®ãã£ãã·ã¥ãåé€ãïŒãã©ãŠã¶ãŒåºæã®åé¡ãé€å€ã§ããããã«ããã©ãŠã¶ãŒã®...ãã¹ãŠã®ãã©ãŠã¶ãŒã®tbhãå«ãïŒãæ¥ä»ãšæå»ã調æŽããå¯èœãªãã©ãŠã¶ãŒãé€å€ããŠã¿ãŸããããããã°ããã»ã¹ãå°ç¡ãã«ãããããããã¬ã¹ã¬ããã亀æãããããå¯èœæ§ã®ããæ¡åŒµæ©èœ...ïŒ/
åèãŸã§ã«ãWindows 10ãšChromeïŒAndroidéçºv0.62.2ïŒã䜿çšãã䟡å€ããããã©ãã
ããã¿ããªç§ã¯ããã§åãããã«ãªã£ãŠããŸã
ReactNativeããŒãžã§ã³ã®äžäžèŽã
JavaScriptããŒãžã§ã³ïŒ0.63.0
ãã€ãã£ãããŒãžã§ã³ïŒ0.62.2ãã€ãã£ãã³ãŒããåæ§ç¯ããããšã確èªããŠãã ããã åé¡ã解決ããªãå Žåã¯ã
watchman watch-del-all && react-native start --reset-cache
ãŠãŠã©ãããã³ãšããã±ãŒãžã£ã®ãã£ãã·ã¥ãã¯ãªã¢ããŠã¿ãŠãã ããã
å芧äŒã§ããã«ç¶ããŠ
ãšã©ãŒ
00:18
ãšã©ãŒïŒãã¢ãžã¥ãŒã«./debugger-ui/debuggerWorker.cff11639.js
ããããã解決ã§ããŸããïŒ
Androidãšãã¥ã¬ãŒã¿ãŒã§ãããã¬ãŒãå®è¡ã§ããŸããã
誰ã§ãéããããŸãã ç§ã¯Windows10ãšChromeã䜿çšããŠããŸãã
以åã®æçš¿ã«æ»ããŸãã 2é±éã®æ€çŽ¢ã®åŸããªã¢ãŒããããã¬ãŒãã¢ã¯ãã£ããªãšãã«èŠéãããonPress()
ã€ãã³ãã«é¢ãã解決çãèŠã€ããŸããã ããã¯ç§ã®é»è©±ãšã©ãããããã®éã®æ°ç§ã®ã¿ã€ãã³ã°ã®éãããç¶ããã æºåž¯é»è©±ã®èªåæé解決ãç¡å¹ã«ããæºåž¯é»è©±ã®æå»ãæåã§1åæ»ããšããã®åé¡ã解決ããŸããã
æ£ããæ¹åãæã瀺ããã¯ã¬ãžããïŒ https ïŒ
ãã ãããªã¢ãŒããããã¬ãŒãã¢ã¯ãã£ãåããŠããåãError: Unable to resolve module
ãæ®ããŸãã ãã®çµæãå€æŽãã³ãŒãã«ä¿åãããåŸãé»è©±æ©ã¯èªåæŽæ°ã§ããªããªããŸãã æåã®æŽæ°åŸãé»è©±ã«Refreshing...
ã¡ãã»ãŒãžã衚瀺ãããŸãã æŽæ°ã¯è¡ããããã³ã³ãœãŒã«ã«è¿œå ã®ãšã©ãŒ/èŠåãåºåãããŸããã æŽæ°ãè¡ã£ãåŸãã¡ãã»ãŒãžã¯é»è©±ã«å°å·ãããªããªããŸãã ãã ããã³ã³ãœãŒã«ãã°ãå°å·ãããŸãã
å¥åŠãªããšã«ãç§ã®ååã¯Arch Linux + ThinkPadã®ã»ããã¢ãããã»ãŒåãã§ãã 圌ã®ããã€ã¹ã§ã¯åé¡ã¯çºçããŸããã åé¡ã®ç¹å®ã«äœæéãè²»ãããŸããããçµæã¯åŸãããŸããã§ããã ãã®ãããä»ã®ãšããããããã¬ãŒãã¢ã¯ãã£ãåããããã³ã«ãä¿åãããã³ã«ã¿ãŒããã«ããã¢ããªãæåã§ãªããŒãããŸãã ãã¡ãããããã¯çç£æ§ã«æ·±å»ãªåœ±é¿ãåãŒããŸãã
$ react-native --version
4.8.0
ïŒyarnãã€ã³ã¹ããŒã«ããŸããããnpmãè©ŠããŸããïŒ
Chromeã®Reactãããã¬ãŒã¿ããããŒããªãã¬ãã·ã¥ïŒã·ãã+ãªãã¬ãã·ã¥ïŒããã€ã³ã¹ãã¯ã¿ãŒã§ã¢ããªã±ãŒã·ã§ã³ããŒã¿ãã¯ãªã¢ããæåŸã«bashã§ã¡ã€ã³ãã³ãã©ãŒã¹ã¬ãããåèµ·åããããšã§è§£æ±ºããŸããïŒnpm startïŒ
éåžžã«ç°¡åãªçã...
誰ãããŸã 解決çãèŠã€ããŸãããïŒ ããã¯ã°ãããŠããŸã....æåéããã¹ãŠãè©ŠããŸãããããŸã ããã«ãããŸã
Chromeã®Reactãããã¬ãŒã¿ããããŒããªãã¬ãã·ã¥ïŒã·ãã+ãªãã¬ãã·ã¥ïŒããã€ã³ã¹ãã¯ã¿ãŒã§ã¢ããªã±ãŒã·ã§ã³ããŒã¿ãã¯ãªã¢ããæåŸã«bashã§ã¡ã€ã³ãã³ãã©ãŒã¹ã¬ãããåèµ·åããããšã§è§£æ±ºããŸããïŒnpm startïŒ
誰ãããŸã 解決çãèŠã€ããŸãããïŒ ããã¯ã°ãããŠããŸã....æåéããã¹ãŠãè©ŠããŸãããããŸã ããã«ãããŸã
Chromeã®Reactãããã¬ãŒã¿ããããŒããªãã¬ãã·ã¥ïŒã·ãã+ãªãã¬ãã·ã¥ïŒããã€ã³ã¹ãã¯ã¿ãŒã§ã¢ããªã±ãŒã·ã§ã³ããŒã¿ãã¯ãªã¢ããæåŸã«bashã§ã¡ã€ã³ãã³ãã©ãŒã¹ã¬ãããåèµ·åããããšã§è§£æ±ºããŸããïŒnpm startïŒ
ãããäœåºŠãè©ŠããŸããã ç§ã®ããã«ããã解決ããŸããã
ãã®ãŠã£ã³ããŠã§SHIFT + F5ã¯OKã§ããïŒ
ç§ã¯èªåã®åé¡ã解決ããŸããïŒ
package.jsonã§
"resolutions": {
"@react-native-community/cli-debugger-ui": "4.7.0"
}
ã€ãŒã³ããã¯ãåé€ããã€ãŒã³ã€ã³ã¹ããŒã«ãå®è¡ããŸãã
RN v0.61.4
ããRN v0.63.1
æŽæ°ããåŸã
ç§ã¯æ¬¡ã®æé ãå®è¡ããŸããã
watchman watch-del-all; rm -rf $TMPDIR/metro-*; rm -rf $TMPDIR/haste-map-*;
rm yarn.lock; rm -rf node_modules; yarn;
resolutions
ãpackage.jsonã«è¿œå ããŸãã"resolutions": {
"@react-native-community/cli-debugger-ui": "4.7.0"
}
ãã®åŸãã·ãã¥ã¬ãŒã¿ãŒã§ãããžã§ã¯ããå®è¡ããŸãããããã¹ãŠå€§äžå€«ã§ãã âš
åãåé¡ã
åãåé¡
åé¡ã¯react-native0.63.1ã§ããŸã ååšããŸã
åãåé¡
ç·šéïŒãšãã¹ãã¯ã©ã€ã¢ã³ãã§ãªã¢ãŒããããã°ãåæ¢ããŸããããæ©èœããŸãã
次ã®ããŒãžã§ã³ã§ãåãåé¡ãçºçããŸãã
"react"ïŒ "16.11.0"ã
"react-native"ïŒ "0.62.2"ã
ç§ã®ããã®ã¹ããã以äžã®ä»äº
ãããè©ŠããŠïŒ
ç§ã«ãšã£ãŠãåæ§ã®åé¡ã§ãã ã§Debug
ãéžæããåŸããããã¬UI httpïŒ// localhost ïŒ8081 / debugger-ui /ãå«ãChromeã¿ãã§éçºè
ã³ã³ãœãŒã«ãéããšã react-native
ã³ã³ãœãŒã«ãŠã£ã³ããŠã«ããã衚瀺ãããŸãã -ç©çAndroidããã€ã¹ã®ã¢ããªéçºè
ã¡ãã¥ãŒïŒ
info Launching Dev Tools...
Error: Unable to resolve module `./debugger-ui/ui.bcd3f9d1.js` from ``:
None of these files exist:
* debugger-ui\ui.bcd3f9d1.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
* debugger-ui\ui.bcd3f9d1.js\index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
at ModuleResolver.resolveDependency (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:163:15)
at ResolutionRequest.resolveDependency (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\node-haste\DependencyGraph\ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\node-haste\DependencyGraph.js:287:16)
at C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\lib\transformHelpers.js:267:42
at Server.<anonymous> (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\Server.js:841:41)
at Generator.next (<anonymous>)
at asyncGeneratorStep (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\Server.js:99:24)
at _next (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\Server.js:119:9)
Error: Unable to resolve module `./debugger-ui/ui.7beef9ab.css` from ``:
None of these files exist:
* debugger-ui\ui.7beef9ab.css(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
* debugger-ui\ui.7beef9ab.css\index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
at ModuleResolver.resolveDependency (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:163:15)
at ResolutionRequest.resolveDependency (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\node-haste\DependencyGraph\ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\node-haste\DependencyGraph.js:287:16)
at C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\lib\transformHelpers.js:267:42
at Server.<anonymous> (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\Server.js:841:41)
at Generator.next (<anonymous>)
at asyncGeneratorStep (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\Server.js:99:24)
at _next (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\Server.js:119:9)
Error: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639.js` from ``:
None of these files exist:
* debugger-ui\debuggerWorker.cff11639.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
* debugger-ui\debuggerWorker.cff11639.js\index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
at ModuleResolver.resolveDependency (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:163:15)
at ResolutionRequest.resolveDependency (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\node-haste\DependencyGraph\ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\node-haste\DependencyGraph.js:287:16)
at C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\lib\transformHelpers.js:267:42
at Server.<anonymous> (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\Server.js:841:41)
at Generator.next (<anonymous>)
at asyncGeneratorStep (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\Server.js:99:24)
at _next (C:\Users\Chase\company\companyMobile\projects\mobile\node_modules\metro\src\Server.js:119:9)
ããŒãžã§ã³æ å ±ïŒ
# Windows 10 64-bit
$ react-native -v
react-native-cli: 2.0.1
react-native: 0.62.2
ç§ã®ã¢ããªã¯ãçŽ2ãæåã«react-native0.60.0ããreact-native0.62.2ã«æŽæ°ãããŸããã
ãã®ãšã©ãŒã¯ãç©ççãªAndroidããã€ã¹ã§ã®ãããã°ãäžæããŸãã å ·äœçã«ã¯ããšã©ãŒããã°ã«èšé²ãããåŸãã¢ããªå ã®å€ãã®UIã€ã³ã¿ã©ã¯ã·ã§ã³ãäžæããã¢ããªã䜿çšã§ããªããªããŸãã ãã ãããšãã¥ã¬ãŒã¿ãŒã§åããšã©ãŒãçºçããŠããã«ãããããããAndroidãšãã¥ã¬ãŒã¿ãŒã§ãããã°ããããšã¯ã§ããŸãã
ãšã©ãŒïŒãã¢ãžã¥ãŒã«./debugger-ui/debuggerWorker.cff11639
ããããã解決ã§ããŸããïŒ
ãããã®ãã¡ã€ã«ã¯ããããååšããŸããã
åãåé¡ã ããã解決ããã®ã«åœ¹ç«ã€è§£æ±ºçã¯ãããŸããã§ããã ãããããã®ééãã¯ç§ãChromeã§ãããã°ããããšã劚ããªãããã§ãã ããããããã¯VSCodeã¿ãŒããã«ã殺ããŸãã
"react"ïŒ "16.13.1"ã
"react-native"ïŒ "0.63.0"ã
ãããç§ã¯expo-cliã§æ°ããexpoãããžã§ã¯ããéå§ããexpo-cliã§ãªã¢ãŒããããã°ãè©ŠããŸããã åããšã©ãŒ/èŠåã¡ãã»ãŒãžã衚瀺ãããŸãã ããã«ãchromeãããã°ã³ã³ãœãŒã«ã¯ã³ãŒãå ã®ã³ãŒããšã©ãŒã®å Žæã衚瀺ããŸããã§ããã ããããå®éã®ãããã°ã§ã¯åœ¹ã«ç«ããªããã«ããã³ãã«ãã¡ã€ã«å ã®å¥åŠãªå Žæã瀺ããŠããŸãã ãã®æ¯ãèãããããã®ãšã©ãŒã«é¢é£ããŠããŠã誰ããåã°çµéšããããšããããã©ããçåã«æã£ãŠããŸããïŒ å®äŸã瀺ãããã«ãapp.jsã«console.logïŒ 'abc'ïŒãè¿œå ããŸãããããã¯ããããã°ã³ã³ãœãŒã«ã«åºåããããã®ã§ãã
abc node_modulesïŒ 5CexpoïŒ 5CAppEntry.bundleplatform = androidïŒdev = trueïŒminify = falseïŒhot = false
ãšã©ãŒïŒ
DevToolsãSourceMapã®èªã¿èŸŒã¿ã«å€±æããŸããïŒ httpïŒ// localhost ïŒ19001 / debugger-ui / ui.bcd3f9d1.js.mapã®ã³ã³ãã³ããèªã¿èŸŒããŸããã§ããïŒHTTPãšã©ãŒïŒã¹ããŒã¿ã¹ã³ãŒã500ãnet :: ERR_HTTP_RESPONSE_CODE_FAILURE
DevToolsãSourceMapã®ããŒãã«å€±æããŸããïŒ httpïŒ// localhost ïŒ19001 / debugger-ui / ui.7beef9ab.css.mapã®ã³ã³ãã³ããããŒãã§ããŸããã§ããïŒHTTPãšã©ãŒïŒã¹ããŒã¿ã¹ã³ãŒã500ãnet :: ERR_HTTP_RESPONSE_CODE_FAILURE
ãããç§ã®Expo蚺æã§ã
Expo CLI 3.23.0ç°å¢æ
å ±ïŒ
ã·ã¹ãã ïŒ
OSïŒWindows 10 10.0.18362
ãã€ããªïŒ
ããŒãïŒ10.16.0-CïŒ\ Program Files \ nodejs \ node.EXE
npmïŒ6.14.6-CïŒ\ Program Files \ nodejs \ npm.CMD
IDEïŒ
Android StudioïŒããŒãžã§ã³4.0.0.0 AI-193.6911.18.40.6626763
npmPackagesïŒ
å芧äŒïŒã38.0.8 => 38.0.8
åå¿ïŒã16.11.0 => 16.11.0
react-domïŒã16.11.0 => 16.11.0
react-nativeïŒhttpsïŒ//github.com/expo/react-native/archive/sdk-38.0.2.tar.gz => 0.62.2
react-native-webïŒã0.11.7 => 0.11.7
åå¿ãã€ãã£ããããžã§ã¯ããã¯ãªã¢ããŠãã ãã...
ããã§ãåãã§ãããç§ãã¡ã¯ãããšäžç·ã«æ®ããå¿ èŠããããšæããŸãã
ãã®ãšã©ãŒã衚瀺ããããŸã§ãç§ã®ãããžã§ã¯ãã§ã¯ãã¹ãŠãæ£åžžã«æ©èœããŠããŸããããä»ã§ã¯ãçããã®ããã«ç«ã¡åŸçããŠããŸãïŒthinkingïŒ
ã¡ã€ã³ã¢ããªãã¯ã©ã¹ã³ã³ããŒãã³ãã§ã¯ãªãæ©èœã³ã³ããŒãã³ãã«å€æŽãããšããã®ãšã©ãŒãæ¶ããããšãçºèŠããŸããã
ãã®åé¡ã解決ããæ¹æ³ãæããŠãã ããã åå¿ãã€ãã£ãåæåããã®æ°èŠã€ã³ã¹ããŒã«ã§ããããã®åé¡ãçºçããŸã
Expoã¯ã©ã€ã¢ã³ãã§ãªã¢ãŒããããã°ãåæ¢ããŸããããæ©èœããŸãããWebãã©ãŠã¶ã䜿çšããŠä¿®æ£ããŸãã
ïŒèŠåïŒ | åçŸå¯èœãªäŸããããŸãã |
---|---|
ïŒæ å ±æºïŒ | åé¡ã«ã¯åçŸå¯èœãªäŸããªãããã§ãã å ±åããŠããåé¡ãæå°éãå®å šãåçŸå¯èœãªæ¹æ³ã§ç€ºãã¹ããã¯ãŸãã¯ãªããžããªãæäŸããŠãã ããã |
ç¬ã¯æããªããããå»ããŸãïŒ
åããšã©ãŒïŒãªã¢ãŒããããã°ïŒãExpo38ã«æŽæ°ããŸãã
ç§ã¯3ã€ã®ããã€ã¹ïŒAndroid 7ãAndroid 8ãiOS 13.3ïŒãæã£ãŠããŸãã ãªã¢ãŒããããã°äžã«ãããããã¹ãŠã«ãã®ãšã©ãŒãçºçããŸãã Android 8ãšiOSã§ã¢ããªãæäœã§ããŸãããAndroid 7ã§ã¯-ãããã onPress
ã€ãã³ãã¯æ©èœããŸããã å芧äŒã§ã¯ãªããRNã®åé¡ã®ããã§ãã
åããšã©ãŒã RNããŒãžã§ã³ïŒ0.63.2
Chromeã®[ãããã¯ãŒã¯]ã¿ãã§ãã£ãã·ã¥ãç¡å¹ã«ãããšã
...ããããã€ãã§ã¯ãªãã ãã®åé¡ãããããã°ãå€ããã«ããããŒããããåé¡ã®åå ã§ãããšç¢ºä¿¡ããŠããŸããé«éæŽæ°ã§ã³ãŒããæŽæ°ãããŸãããã¢ããªã®ãªããŒãæã«å€ããã£ãã·ã¥ããŒãžã§ã³ã«ãªã£ãŠããŸããŸãã ããã¯çºèŠããã®ã楜ãããã®ã§ãã.... react-nativeãããã¡ã€ãªã³ã°ããŒã«ãšãããã°ããŒã«ïŒç¹ã«Androidãšãã¥ã¬ãŒã¿ãŒïŒã®ç¶æ ã¯çŸæç¹ã§ã¯ããªãæ²ããã§ãããæ®å¿µãªããç§ã¯ããããæ¹åããããã®ãã€ãã£ãã³ãŒãã®çµéšããããŸããã
ç·šéïŒããã¯https://github.com/facebook/react-native/issues/29424ã«é¢é£ããŠããã®ã ãããïŒ ããã¯ãããã°ããŠããªããšãã«ãèµ·ãããŸããã
ããã§åããšã©ãŒã
ããã¯ééããªããœãŒã¹ãããã«é¢é£ãããšã©ãŒã§ãã ãœãŒã¹ãããã®URLãååŸããããšãããšããã®ãšã©ãŒããã³ããããŸãã devtoolsèšå®ã§jsãšcssã®äž¡æ¹ã®ãœãŒã¹ããããç¡å¹ã«ãããšããšã©ãŒã¯è¡šç€ºãããªããªããŸãã ç§ã¯ãããããããçæããŠããªãããæäŸããŠããªããã®ã©ã¡ããã ãšæããŸããïŒ
ãªããããªãã®ã誰ããç¥ã£ãŠããŸããïŒ ç§ã®å Žåãããã¯Windowsã§èµ·ãã£ãŠããŸã
ãã®åé¡ã¯ç§ã«ãšã£ãŠã©ã³ãã ã«çºçããŸãããçºçããå Žåã¯è§£æ¶ããããããŸããã ããããããã¯ç§ã«ãšã£ãŠã¯ããŸããããŸããã å°ãæéãããããŸãããããããã¯ææªã®ã·ããªãªãšããŠãããå®è¡ããŸãã
æããã«ãã·ãã¥ã¬ãŒã¿ãŒã§å®è¡ããŠããå Žåã¯ãããã»ã¹ããããã«èª¿æŽããå¿ èŠããããŸãã
ã¹ã¿ã€ã«ã·ãŒãã®cssã¹ã¿ã€ã«ãšã©ãŒãä¿®æ£ããããšã§ããã®ãšã©ãŒãä¿®æ£ããŸããã
以äžã®ããã«å€ã衚瀺ãããcssã¹ã¿ã€ã«ã·ãŒãããããŸããjustifyContentã®å€ããã®ãšã©ãŒã®åå ã§ããã justifyContentã®å€ãä¿®æ£ããåŸãã¢ããªãæ£åžžã«èªã¿èŸŒãŸããŸããã
loginOrCreateTabContainer:{
flexDirection: "row",
justifyContent: "stretch",
},
ãããžã§ã¯ãã0.61ããRN0.63.2ã«ã¢ããã°ã¬ãŒãããåŸãiOSã§åãåé¡ãçºçããŸãã
react-native init
äœæãããæ°ãã空ã®ãããžã§ã¯ãã§ãåãåé¡ãçºçããŸãã
ç§ã¯ããã«2æ¥éã®å€§éšåãè²»ãããäžèšã®ææ¡ããããã¹ãŠã®è§£æ±ºçãè©ŠããŸããããæåããŸããã§ããã ç§ã¯macOS10.15.5ãå®è¡ããŠããçæ°ããMacBookãè©Šããå¿ èŠãªéçºããŒã«ããã¹ãŠã®ææ°ããŒãžã§ã³ã§ã»ããã¢ããããŸãããåãåé¡ã§ãã
ãããç§ã®ãšã©ãŒã®è©³çŽ°ãšreact-nativeæ
å ±ã®åºåã§ã
ãããã¬ãŒãæ¥ç¶ãããšã次ã®ãšã©ãŒãã³ã³ãœãŒã«ã«è¡šç€ºãããŸãã
Error: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639` from ``:
None of these files exist:
* debugger-ui/debuggerWorker.cff11639(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
* debugger-ui/debuggerWorker.cff11639/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
at ModuleResolver.resolveDependency (/Users/jeremy/Developer/source/MyCep-Upgrade/MyCep/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
at ResolutionRequest.resolveDependency (/Users/jeremy/Developer/source/MyCep-Upgrade/MyCep/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (/Users/jeremy/Developer/source/MyCep-Upgrade/MyCep/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
at /Users/jeremy/Developer/source/MyCep-Upgrade/MyCep/node_modules/metro/src/lib/transformHelpers.js:267:42
at /Users/jeremy/Developer/source/MyCep-Upgrade/MyCep/node_modules/metro/src/Server.js:1096:37
at Generator.next (<anonymous>)
at asyncGeneratorStep (/Users/jeremy/Developer/source/MyCep-Upgrade/MyCep/node_modules/metro/src/Server.js:99:24)
at _next (/Users/jeremy/Developer/source/MyCep-Upgrade/MyCep/node_modules/metro/src/Server.js:119:9)
at process._tickCallback (internal/process/next_tick.js:68:7)
React Nativeæ å ±ïŒ
$ react-native info
info Fetching system and libraries information...
System:
OS: macOS 10.15.5
CPU: (8) x64 Intel(R) Core(TM) i7-6820HQ CPU @ 2.70GHz
Memory: 1.19 GB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 10.22.0 - ~/.nvm/versions/node/v10.22.0/bin/node
Yarn: Not Found
npm: 6.14.6 - ~/.nvm/versions/node/v10.22.0/bin/npm
Watchman: 4.7.0 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.8.4 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: iOS 13.6, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
Android SDK:
API Levels: 20, 23, 24, 25, 26, 27, 28
Build Tools: 23.0.1, 23.0.3, 25.0.0, 25.0.2, 25.0.3, 26.0.0, 26.0.1, 26.0.2, 27.0.0, 27.0.1, 27.0.2, 27.0.3, 28.0.3, 29.0.0
System Images: android-24 | Google Play Intel x86 Atom, android-25 | Google APIs Intel x86 Atom, android-26 | Google Play Intel x86 Atom
Android NDK: Not Found
IDEs:
Android Studio: 3.3 AI-182.5107.16.33.5314842
Xcode: 11.6/11E708 - /usr/bin/xcodebuild
Languages:
Java: 1.8.0_131 - /usr/bin/javac
Python: 2.7.15 - /usr/local/bin/python
npmPackages:
@react-native-community/cli: Not Found
react: 16.13.1 => 16.13.1
react-native: 0.63.2 => 0.63.2
npmGlobalPackages:
*react-native*: Not Found
iOSãšãã¥ã¬ãŒã¿ãŒãæèŒããmacOS10.15.6ã§RN0.63.2ãå®è¡ããŸãã ãããŠãç§ã¯å°ãªããšã6ãæé£ç¶ã§ãã®ãšã©ãŒã«èŠããã§ããŸãã ã¹ã¿ãã¯ãååŸãããã³ã«åœ¹ç«ã€ãã®ã¯æ¬¡ã®ãšããã§ãã
** 1ã Macãåèµ·åããŸã
ãããïŒ
åé¿çã誰ããå©ããããšãé¡ã£ãŠããŸãïŒ GL
iOSãšãã¥ã¬ãŒã¿ãŒãæèŒããmacOS10.15.6ã§RN0.63.2ãå®è¡ããŸãã ãããŠãç§ã¯å°ãªããšã6ãæé£ç¶ã§ãã®ãšã©ãŒã«èŠããã§ããŸãã ã¹ã¿ãã¯ãååŸãããã³ã«åœ¹ç«ã€ãã®ã¯æ¬¡ã®ãšããã§ãã
1.Macãåèµ·åããŸã2. $ react-native start --reset-cache 3.XCodeããã¢ããªãå®è¡ããŸã
ãããïŒ
- ãreact-nativestart--reset-cacheãã®å®è¡ãèŠéãããããªãã§XCodeãããããžã§ã¯ããéå§ãããšããã¢ãžã¥ãŒã«ã解決ã§ããŸãããããã£ããããå¯èœæ§ãããã圹ç«ã€ã®ã¯èãªãã·ã¹ãã ã®åèµ·åã ãã§ãïŒ
- éçºãçµäºãããã³ã«ãã¿ãŒããã«ã§cmd + Cããšãã¥ã¬ãŒã¿ãŒã§cmd + QãXCodeã§åæ¢ïŒcmd +ãïŒãChromeã®ãããã¬ãŒã¿ããéããŸãã
åé¿çã誰ããå©ããããšãé¡ã£ãŠããŸãïŒ GL
ãã®åŸãæäŒã«è¡ã£ãŠãã£ã³ãã«ãç¯ãããã³ãã°ã©ã ãæããã¿ã³ããªã³ã§2ã3æéèžããŸãã :) :) :)
ãã®ãããã¬ãŒã®äœ¿çšãåæ¢ããreactNativeãããã¬ãŒã¢ããªã±ãŒã·ã§ã³ã®äœ¿çšãéå§ããããšã§è§£æ±ºããŸããã
ç§ã¯ã¢ã³ããã€ãã§ãã®åé¡ã«çŽé¢ããŠããŸãããç§ã¯äžèšã®ãã¹ãŠãè©ŠããŸããããäœãæ©èœããŸããã§ããã åŸã§ãäŸåé¢ä¿ãã€ã³ã¹ããŒã«ãããããããé©åã«æ§æãããŠããªãããšãåé¡ã®åå ã§ããããšãããããŸãããç§ã®å Žåã¯ããŸã é©åã«æ§æãããŠããªããããreact-native-firebaseã§ããããã®åŸããããåé€ããŸããããããã¬ãŒãæå¹ã«ããŠã¢ããªãå®è¡ããŸãã
åãåé¡ã«çŽé¢ããŠãã
ãreact-nativeãã®äœ¿çšïŒã0.62.2ã
ãã£ãã·ã¥ã®ãªã»ãããŸãã¯åèµ·åãªãã§åé¡ãä¿®æ£ãããŸãã
åå¿ã«æ»ã-0.62.2ãããã€ãã£ã0.23.1ã¯ç§ã®ããã«ããã解決ããŸãã
å¥åŠãªãã®ã @HenriqueDerosaã«ãã£ãŠæçš¿ãããåé¿çã¯ç§ã«ãšã£ãŠã¯ããŸã
ç°å¢ïŒ
ãã®ãšã©ãŒã¯ãããŒã«ã«ã§ãã¹ããããŠããã¢ããªã±ãŒã·ã§ã³ã§GETãªã¯ãšã¹ããå®è¡ããããšãããšãã«çºçããŸãã
try {
api.get('/projects').then(response => { //api has the baseUrl/Computer Ip
console.log("Done!");
});
} catch (error) {
console.log(error);
}
ãšã©ãŒïŒ
index.bundle?platforâŠ&minify=false:41548 Possible Unhandled Promise Rejection (id: 1):
Error: Network Error
Error: Network Error
at createError (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:99384:17)
at EventTarget.handleError (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:99288:16)
at EventTarget.dispatchEvent (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:32277:27)
at EventTarget.setReadyState (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:31367:20)
at EventTarget.__didCompleteResponse (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:31183:16)
at http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:31293:47
at RCTDeviceEventEmitter.emit (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:3537:37)
at MessageQueue.__callFunction (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2765:31)
at http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2497:17
at MessageQueue.__guard (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2719:13)
åãåé¡ã
React-nativeããŒãžã§ã³ã¯0.61.5ã§ã
äžèšã®æšå¥šäºé
ã¯åœ¹ã«ç«ã¡ãŸããã§ãã
ã¢ããããŒãïŒ
ç§ã«ãšã£ãŠãReduxããã®åé¡ã®åå ã§ããããã¹ãŠãã»ããã¢ãããããã¹ãã¢ã«å¿
èŠãªãã¹ãŠã®å€ããããã©ããã調ã¹ãŠã¿ãŠãã ãã
Androidããã€ã¹ã§åãåé¡
Error: Unable to resolve module `./debugger-ui/ui.bcd3f9d1.js` from
ïŒ ``
ç§ã¯ãã¹ãŠã®ã¹ããããè©ŠããŸããããäœãæ©èœããŸããã android9.0ã€ã¡ãŒãžã䜿çšãããããã°ãšåå¿-ãã€ãã£ã0.63.2
åã
+1
ãã®åé¡ã¯ãChromeã®React NativeDebuggerã«é¢é£ããŠããããã§ãã Expoã¯ã©ã€ã¢ã³ãããšãã¥ã¬ãŒã¿ãŒã«åã€ã³ã¹ããŒã«ããŠããã¢ããªãèµ·åããŸããããåé¡ã¯è§£æ±ºããŸããã Dubug RemoteJSãªãã·ã§ã³ãéžæããªãã§ãã ããã
https://reactnavigation.org/docs/troubleshooting/#app -is-not-working-properly-when-connected-to-chrome-debugger
ããã¿ããªãç§ã¯ãã®åé¡ãæ±ããŠããŸããããããŠç§ã®ããã«åããã®ã¯ã¡ããã©ç§ã®ã°ãŒã°ã«ã¯ããŒã ãã£ãã·ã¥ãã¯ãªã¢ããããšã§ããã
ãããŠããåäœããããšã¯ãã·ãã¥ã¬ãŒã¿ãŒã«èµ€ããšã©ãŒç»é¢ã衚瀺ããããéåžžã©ããéçºãç¶è¡ã§ããããšãæå³ããŸãã
ç§ã®ããã«è§£æ±ºããŸããã ããããšã
å¥åŠãªãã®ã @HenriqueDerosaã«ãã£ãŠæçš¿ãããåé¿çã¯ç§ã«ãšã£ãŠã¯ããŸã
ç°å¢ïŒ
ãã®ãšã©ãŒã¯ãããŒã«ã«ã§ãã¹ããããŠããã¢ããªã±ãŒã·ã§ã³ã§GETãªã¯ãšã¹ããå®è¡ããããšãããšãã«çºçããŸããtry { api.get('/projects').then(response => { //api has the baseUrl/Computer Ip console.log("Done!"); }); } catch (error) { console.log(error); }
ãšã©ãŒïŒ
index.bundle?platforâŠ&minify=false:41548 Possible Unhandled Promise Rejection (id: 1): Error: Network Error Error: Network Error at createError (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:99384:17) at EventTarget.handleError (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:99288:16) at EventTarget.dispatchEvent (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:32277:27) at EventTarget.setReadyState (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:31367:20) at EventTarget.__didCompleteResponse (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:31183:16) at http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:31293:47 at RCTDeviceEventEmitter.emit (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:3537:37) at MessageQueue.__callFunction (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2765:31) at http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2497:17 at MessageQueue.__guard (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2719:13)
ãšãã¥ã¬ãŒã¿ãŒã§ã¢ã³ã€ã³ã¹ããŒã«ããããšã¯ç§ã®ããã«ããªãã¯ãããŸãã
React NativeDebugã®ãStopDebuggingããšãDebugãã§ããã解決ããŸãã
ãããã¬ãŒãã¯ã©ãã·ã¥ããã-ui / EXPO-CLI
React-native expo SDK 39
DevToolsãSourceMapã®èªã¿èŸŒã¿ã«å€±æããŸããïŒ httpïŒ// localhost ïŒ19001 / debugger-ui / ui.bcd3f9d1.js.mapã®ã³ã³ãã³ããèªã¿èŸŒããŸããã§ããïŒHTTPãšã©ãŒïŒã¹ããŒã¿ã¹ã³ãŒã500ãnet :: ERR_HTTP_RESPONSE_CODE_FAILURE
åãåé¡ã«çŽé¢ããŸããã ãŠã©ãããã³ã®ææ°ããŒãžã§ã³ãã€ã³ã¹ããŒã«ããããšã¯ç§ãå©ããŸãã
https://facebook.github.io/watchman/docs/install.html
åãåé¡ã«çŽé¢ããŸããã ãŠã©ãããã³ã®ææ°ããŒãžã§ã³ãã€ã³ã¹ããŒã«ããããšã¯ç§ãå©ããŸãã
https://facebook.github.io/watchman/docs/install.html
@ vovka-ææ°ããŒãžã§ã³ïŒ4.9.0ïŒã®ãŠã©ããã¡ã³ãã€ã³ã¹ããŒã«ããæ°ããåæåãããrnã¢ããªã®ã¿ãå®è¡ãããšããŠãããŸã éããããŸããã
react-native init itdidaAppCompany
macOS 10.15.7
RNïŒ0.63.2
Error: Unable to resolve module `./debugger-ui/ui.bcd3f9d1.js` from ``:
None of these files exist:
* debugger-ui/ui.bcd3f9d1.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
* debugger-ui/ui.bcd3f9d1.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
at ModuleResolver.resolveDependency (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
at ResolutionRequest.resolveDependency (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
at /Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/lib/transformHelpers.js:267:42
at Server.<anonymous> (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/Server.js:841:41)
at Generator.next (<anonymous>)
at asyncGeneratorStep (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/Server.js:99:24)
at _next (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/Server.js:119:9)
at processTicksAndRejections (internal/process/task_queues.js:93:5)
åãåé¡ã«çŽé¢ããŸããã ãŠã©ãããã³ã®ææ°ããŒãžã§ã³ãã€ã³ã¹ããŒã«ããããšã¯ç§ãå©ããŸãã
https://facebook.github.io/watchman/docs/install.html@ vovka-ææ°ããŒãžã§ã³ïŒ4.9.0ïŒã®ãŠã©ããã¡ã³ãã€ã³ã¹ããŒã«ããæ°ããåæåãããrnã¢ããªã®ã¿ãå®è¡ãããšããŠãããŸã éããããŸããã
react-native init itdidaAppCompany
macOS 10.15.7
RNïŒ0.63.2Error: Unable to resolve module `./debugger-ui/ui.bcd3f9d1.js` from ``: None of these files exist: * debugger-ui/ui.bcd3f9d1.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx) * debugger-ui/ui.bcd3f9d1.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx) at ModuleResolver.resolveDependency (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15) at ResolutionRequest.resolveDependency (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18) at DependencyGraph.resolveDependency (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/node-haste/DependencyGraph.js:287:16) at /Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/lib/transformHelpers.js:267:42 at Server.<anonymous> (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/Server.js:841:41) at Generator.next (<anonymous>) at asyncGeneratorStep (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/Server.js:99:24) at _next (/Users/forrest/Downloads/itdidaAppCompany/node_modules/metro/src/Server.js:119:9) at processTicksAndRejections (internal/process/task_queues.js:93:5)
ç§ã¯Windows10ã䜿çšããŠããŸã&& react-nativeïŒææ°
ç§ã«ãåãåé¡ãçºçããŸãã ãŠã©ãããã³ãã€ã³ã¹ããŒã«ããåŸã§ãã@ react-native-community / cli-debugger-uiïŒreact-devtools-coreã
äœãæ©èœããŸããã§ãã
ãããã°ã«ã¯ããã䜿çšããããšããå§ãããŸã
https://github.com/jhen0409/react-native-debugger
expoã䜿çšããŠããŠãsdk-38.0.2ã«ã¢ããã°ã¬ãŒãããããããªã¢ãŒããããã°ã䜿çšã§ããªããªããŸããã ç§ã®ã¢ããªã¯ãã°ã€ã³ããŒãžãããŒãããŸããããã¹ãŠã®ãã¿ã³ãšå ¥åãå¿çããªããªããŸãã ãããããã¿ã³ãäœåºŠãã¯ãªãã¯ããåŸããã¿ã³ã¯æçµçã«ã¯æ©èœããããã«ãªããŸããã ãªã¢ãŒããããã°ãç¡å¹ã«ãªã£ãŠããå Žåãã¢ããªã¯æ£åžžã«åäœããŸãã expoã®reactnativesdk-36.0.1ãšexpo36.0.2ã«æ»ããªããã°ãªããŸããã§ããã
åäœããªã
package.json
"expo"ïŒ "^ 38.0.0"ã
"react-native"ïŒ " https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz "ã
package-lock.json
å芧äŒïŒ38.0.10
åã
package.json
"expo"ïŒ "^ 36.0.0"ã
"react-native"ïŒ " https://github.com/expo/react-native/archive/sdk-36.0.1.tar.gz "ã
package-lock.json
å芧äŒïŒ36.0.2
package.jsonãæ©èœããªã
`` `{
"main"ïŒ "node_modules / expo / AppEntry.js"ã
ãã¹ã¯ãªãããïŒ{
ãã¹ã¿ãŒããïŒããšãã¹ãã¹ã¿ãŒããã
"android"ïŒ "expo start --android"ã
"ios"ïŒ "expo start --ios"ã
ãã€ãžã§ã¯ããïŒããšã¯ã¹ãã€ãžã§ã¯ããã
"lint"ïŒ "eslintã-c.eslintrc.js--ext .js"ã
ããããŒãïŒããããŒãã
ãpublish-updatesãïŒãexpopublishãã
"build-android-apk"ïŒ "expo buildïŒandroid -t apk"ã
"build-android-aab"ïŒ "expo buildïŒandroid -t app-bundle"ã
"build-ios"ïŒ "expo buildïŒios "
}ã
ãäŸåé¢ä¿ãïŒ{
"@ expo / vector-icons"ïŒ "^ 10.0.0"ã
"@ react-native-community / masked-view"ïŒ "0.1.10"ã
"@ react-navigation / drawer"ïŒ "^ 5.0.0"ã
"@ react-navigation / native"ïŒ "^ 5.0.0"ã
"@ react-navigation / stack"ïŒ "^ 5.0.0"ã
"expo"ïŒ "^ 38.0.0"ã
"expo-linear-gradient"ïŒ "ã8.2.1"ã
"expo-notifications"ïŒ "ã0.3.3"ã
"expo-permissions"ïŒ "ã9.0.1"ã
"lodash"ïŒ "^ 4.17.20"ã
"ã¢ãŒã¡ã³ã"ïŒ "^ 2.24.0"ã
"prop-types"ïŒ "^ 15.7.2"ã
"react"ïŒ "16.11.0"ã
"react-dom"ïŒ "16.11.0"ã
"react-native"ïŒ " https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz "ã
"react-native-gesture-handler"ïŒ "ã1.6.0"ã
"react-native-keyboard-aware-scroll-view"ïŒ "^ 0.9.2"ã
"react-native-reanimated"ïŒ "ã1.9.0"ã
"react-native-safe-area-context"ïŒ "ã3.0.7"ã
"react-native-screens"ïŒ "ã2.9.0"ã
"react-native-web"ïŒ "ã0.11.7"ã
"react-navigation"ïŒ "^ 3.11.1"ã
"react-navigation-header-buttons"ïŒ "^ 3.0.1"ã
"react-redux"ïŒ "^ 7.1.0"ã
"redux"ïŒ "^ 4.0.4"ã
"redux-thunk"ïŒ "^ 2.3.0"
}ã
"devDependencies"ïŒ{
"babel-eslint"ïŒ "^ 10.1.0"ã
"babel-preset-expo"ïŒ "^ 8.2.3"ã
"eslint"ïŒ "^ 7.10.0"ã
"eslint-config-airbnb"ïŒ "^ 18.2.0"ã
"eslint-config-prettier"ïŒ "^ 6.12.0"ã
"eslint-plugin-extra-rules"ïŒ "0.0.0-development"ã
"eslint-plugin-import"ïŒ "^ 2.22.0"ã
"eslint-plugin-jsx-a11y"ïŒ "^ 6.3.1"ã
"eslint-plugin-prettier"ïŒ "^ 3.1.4"ã
"eslint-plugin-react"ïŒ "^ 7.21.2"ã
"eslint-plugin-react-native"ïŒ "^ 3.9.1"ã
"eslint-plugin-sort-class-members"ïŒ "^ 1.8.0"ã
"eslint-plugin-unused-imports"ïŒ "^ 0.1.3"ã
"ãããŒ"ïŒ "^ 0.2.3"ã
"ãããŒãã³"ïŒ "^ 0.134.0"ã
"ããããã"ïŒ "^ 2.1.2"ã
"redux-devtools-extension"ïŒ "^ 2.13.8"
}ã
ããã©ã€ããŒããïŒtrue
}
package.json Working
```{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"eject": "expo eject",
"lint": "eslint . -c .eslintrc.js --ext .js",
"flow": "flow",
"publish-updates": "expo publish",
"build-android-apk": "expo build:android -t apk",
"build-android-aab": "expo build:android -t app-bundle",
"build-ios": "expo build:ios"
},
"dependencies": {
"@expo/vector-icons": "^10.2.1",
"@react-native-community/masked-view": "0.1.5",
"@react-navigation/drawer": "^5.0.0",
"@react-navigation/native": "^5.0.0",
"@react-navigation/stack": "^5.0.0",
"expo": "^36.0.0",
"expo-linear-gradient": "~8.0.0",
"lodash": "^4.17.20",
"moment": "^2.24.0",
"prop-types": "^15.7.2",
"react": "16.11.0",
"react-dom": "16.9.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-36.0.1.tar.gz",
"react-native-gesture-handler": "~1.5.0",
"react-native-keyboard-aware-scroll-view": "^0.9.1",
"react-native-reanimated": "~1.4.0",
"react-native-safe-area-context": "0.6.0",
"react-native-screens": "2.0.0-alpha.12",
"react-native-web": "^0.11.7",
"react-navigation": "^3.11.1",
"react-navigation-header-buttons": "^3.0.1",
"react-redux": "^7.1.0",
"redux": "^4.0.4",
"redux-thunk": "^2.3.0"
},
"devDependencies": {
"babel-eslint": "^10.1.0",
"babel-preset-expo": "^8.2.3",
"eslint": "^7.10.0",
"eslint-config-airbnb": "^18.2.0",
"eslint-config-prettier": "^6.12.0",
"eslint-plugin-extra-rules": "0.0.0-development",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-jsx-a11y": "^6.3.1",
"eslint-plugin-prettier": "^3.1.4",
"eslint-plugin-react": "^7.21.2",
"eslint-plugin-react-native": "^3.9.1",
"eslint-plugin-sort-class-members": "^1.8.0",
"eslint-plugin-unused-imports": "^0.1.3",
"flow": "^0.2.3",
"flow-bin": "^0.134.0",
"prettier": "^2.1.2",
"redux-devtools-extension": "^2.13.8"
},
"private": true
}
ãã©ãŠã¶ã®ãã£ãã·ã¥ãã¯ãªã¢ãã/ã·ãŒã¯ã¬ããã¢ãŒãã䜿çšããŠã¿ãŠãã ãã
RN0.62.2ã䜿çšããWindows10ã§ãåãåé¡ãçºçããŸãã
å芧äŒã䜿çšããŠããŸããã
ããŠãææ°ã®expo cliãã€ã³ã¹ããŒã«ãããexpo upgradeãã䜿çšããŠãExpoã§ãããä¿®æ£ããããšãã§ããŸããã
ãšãã¹ã39.0.3
Expoã®ReactNative https://github.com/expo/react-native/archive/sdk-39.0.3.tar.gz
https://github.com/babel/minify/issues/950 ã
ãã®ãœãªã¥ãŒã·ã§ã³ã¯ç§ãå©ããŸãããããªãã®ãããžã§ã¯ãããã§ãã¯ããŠãã ãããbabel.config.jsã§ã 'transform-remove-console'
@LixingYãªã³ã¯ã®æåŸã«äœåãªã³ã³ããããã httpsïŒ//github.com/babel/minify/issues/950ã§ããå¿ èŠããã
ãšã«ãããããã¯ç§ãå©ããŸããã§ããã
ãã®ãã¡ã€ã«ãåé€ããŸãããtransform-remove-console
ïŒæ¬¡ã«ã¢ããªãã¢ã³ã€ã³ã¹ããŒã«ããŠreact-native start --reset-cacheãå®è¡ããè©ŠããŠã¿ãŸã
å件人ïŒãšãã·[email protected]
ÏéæéïŒ2020幎10æ12æ¥10:11
å件人ïŒfacebook / react-native [email protected]
æéïŒAaron [email protected] ; èšå@ noreply.github.com
äž»é¢ïŒReïŒ[facebook / react-native]ãšã©ãŒïŒãïŒïŒïŒ28844ïŒãããã¢ãžã¥ãŒã«./debugger-ui/debuggerWorker.cff11639.js
ã解決ã§ããŸãã
@LixingY https://github.com/LixingYãªã³ã¯ã®æåŸã«äœåãªã«ã³ãããããbabel / minifyïŒ950https ïŒ //github.com/babel/minify/issues/950ã§ããå¿ èŠããã
ãšã«ãããããã¯ç§ãå©ããŸããã§ããã
â
ããªããèšåãããã®ã§ããªãã¯ãããåãåã£ãŠããŸãã
ãã®ã¡ãŒã«ã«çŽæ¥è¿ä¿¡ããããGitHub https://github.com/facebook/react-native/issues/28844#issuecomment-707025336ã§è¡šç€ºãããã ãã ããã
ãã®ãã¡ã€ã«ãããªãŒã«è¡šç€ºãããŸããã
ç§ãç解ããŠããªãããšã®1ã€ã¯ãbabelã§ã®åç
§ã¯æ¬çªç°å¢ã§ããããããã°ã¢ãŒãã«ã€ããŠè©±ããŠããããšã§ãã
ããã€ã¹ã®æ¥ä»ãæªæ¥ã«èšå®ãããšããããã¯ãŒã¯èŠæ±ã¯å®è¡ãããŸããã
ãããšãç§ã¯react-native0.63.3ã䜿çšããŠããŸãã
ãããä¿®æ£ããããã«ç§ãè¡ã£ãããšã¯ãå®è¡äžã®ãã¹ãŠã®ããã°ã©ã ãéããããšã§ãã OSãåèµ·åãããšãæ¶ããŠããŸããŸãã
ããã¯ãããã°ã©ã ãå®è¡ããŠãµããéããããé·æéã¹ãªãŒãããããšãã«çºçãããšæããŸãã
ãããšãç§ã¯react-native0.63.3ã䜿çšããŠããŸãã
ãããä¿®æ£ããããã«ç§ãè¡ã£ãããšã¯ãå®è¡äžã®ãã¹ãŠã®ããã°ã©ã ãéããããšã§ãã OSãåèµ·åãããšãæ¶ããŠããŸããŸãã
ããã¯ãããã°ã©ã ãå®è¡ããŠãµããéããããé·æéã¹ãªãŒãããããšãã«çºçãããšæããŸãã
ç§ã®å Žåã¯æ©èœããŸããïŒ0.62.2ïŒ
ããã§ãåé¡ã解決ããªãå Žåã¯ãreact-navigationv4ã䜿çšããŠã¿ãŠãã ããã ç§ã¯v5ãæã£ãŠããŠããããv4ã«ããŠã³ã°ã¬ãŒãããããã¯æ©èœããŸããã
ç§ã«ã¯é¢ä¿ãããŸããã ç§ã¯react-navigationããŸã£ãã䜿çšããŠããŸããïŒä»ã®ã³ã¡ã³ãã®ããã«expoã䜿çšããŠããŸããïŒã
Expoã¢ããªã±ãŒã·ã§ã³ãåã€ã³ã¹ããŒã«ãããšãããåé¡ã¯è§£æ±ºããŸããã å€åããã¯èª°ããå©ããã§ãããã
åãåé¡ããããŸãã æ°æ¥éããã«èŠããã§ããŸãïŒ/
ã³ãŒãããããã°ã§ããŸããã
ãreact-nativeããšåãåé¡ïŒã0.62.2ã
cmd + Rã2åéãæŒããšæ¶ããŸããã次ã®ãªããŒãã§åã³ãšã©ãŒãã¹ããŒãããŸã
0.62.2ã䜿çšãããšãšã©ãŒãçºçããŸããã 0.63.3ã«ã¢ããã°ã¬ãŒããããšããããšã©ãŒã¯ãŸã çºçããŠããŸãã
ããã圹ç«ã€ãã©ããã¯ããããŸããããã¡ãããã³ãã©ãŒãŠã£ã³ããŠã«å
¥ããšã次ã®ããã«ãªããŸãã
Chromeã³ã³ãœãŒã«ã«ã¯æ¬¡ã®ããã«è¡šç€ºãããŸãã
@ rahamin1ãããžã§ã¯ãã§babel.config.js
ãã¡ã€ã«ãèŠã€ããŸãããïŒ
ãããžã§ã¯ãã§babel.config.jsãã¡ã€ã«ãèŠã€ããŸãããïŒ
ã¯ãã
ãã®å 容ã¯æ¬¡ã®ãšããã§ãã
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
};
ç§ã¯èª°ãã®ã¢ããã€ã¹ã«åŸã£ãŠããã次ã®ããã«å€æŽããŸããïŒ
module.exports = function(api) {
api.cache(true);
if (process.env.NODE_ENV === 'production' || process.env.BABEL_ENV === 'production') {
return {
"presets": ["module:metro-react-native-babel-preset"],
"plugins": ["react-native-paper/babel", ["transform-remove-console", {"exclude": ["error", "warn", "info"]}]]
}
} else {
return {
"presets": ["module:metro-react-native-babel-preset"],
}
}
}
ãããã®ã©ãã圹ã«ç«ã¡ãŸããã§ããã
@ rahamin1 ok ..ãã®ã³ãŒããåé€transform-remove-console
ã次ã«ã¿ãŒããã«ãéããã¢ããªãã¢ã³ã€ã³ã¹ããŒã«ãããã©ãŠã¶ãéãã次ã«ã¿ãŒããã«å®è¡yarn start --reset-cache
ã§ã¯ããã¡ã€ã«ã次ã®ããã«ããŸããïŒ
module.exports = function(api) {
api.cache(true);
if (process.env.NODE_ENV === 'production' || process.env.BABEL_ENV === 'production') {
return {
"presets": ["module:metro-react-native-babel-preset"],
}
} else {
return {
"presets": ["module:metro-react-native-babel-preset"],
}
}
}
api.cache(true)
è¿œå ããã ãã§ã以åãšã»ãŒåãã§ãã
@ rahamin1ããã
ããã¯ããªãã¯ãããŸããããããäžåºŠã ã...ãŸãã¯å€åç§ã¯ãšã©ãŒãéããŸãã...ããããããŸããã
ãã®åŸãããäžåºŠè©ŠããŠã¿ãŸããããåãæé ãç¹°ãè¿ããŸããããæ©èœããªããªããŸãã...
å©ããŠãããŠããããšãïŒ
@ rahamin1 ãå€åãŸãã¯ããªãã¯api.cache(true)
åé€ããããšãã§ããŸããïŒ
ãã®å Žåãå
ã®ãã¡ã€ã«ãååŸããŸã...
ããŸããããŸããã§ãããããããããé¡ãããŸãïŒ
ãã®å Žåãå ã®ãã¡ã€ã«ãååŸããŸã...
ããŸããããŸããã§ãããããããããé¡ãããŸãïŒ
ã³ã³ãœãŒã«ãšã©ãŒããããŸããïŒ react-navigationãæŽæ°ãããšããã®åé¡ã解決ããŸããã
ããã€ãã®èŠåã ãšã©ãŒã¯ãããŸããã
ããã§ã®äœæ¥ã«æè¬ããä¿®æ£ãããã«ããŒãžãããããšã確èªã§ããŠããããã§ãã ããããã€å ¬éãããŠäœ¿çšã§ããããã«ãªããã«ã€ããŠãäœãèãã¯ãããŸããïŒ
ç§ã¯çŸåšãExpo 37 â> 39ããã¢ããã°ã¬ãŒãäžã§ããããã®åé¡ã«ãããããã°äœæ¥ã劚ããããŠããŸããExpoã®æ åœè ã¯ãããªããåºããä¿®æ£ãå®è£ ããå¿ èŠããããšæããŸãã ç§ã¯ããã«å¯Ÿããä¿®æ£ãèŠã€ããããã«çŽ6æéè²»ãããã®ã§ã37ã«ããŒã«ããã¯ãã以å€ã®çæçãªè§£æ±ºçã誰ããç¥ã£ãŠããå Žåã¯ãç§ãã¡ã«ç¥ãããŠãã ããã
@ fredrivett-ããã«ã¡ã¯ïŒ ç§ã¯å芧äŒã«åãçµãã§ãããåé¡ãä¿®æ£ãã@thymikeeã¯ããã«ãã£ãšããçããããšãã§ãããããããŸããã
æŽæ°@brentvatneãããããšããExpoãšReact NativeããŒã ãè¡ã£ããã¹ãŠã®äœæ¥ã«æ¬åœã«æè¬ããã¢ããªéçºè ãšããŠã®ç§ãã¡ã®ä»äºããšãŠãç°¡åã«ããŸãã ããã§ã§ããããšãããŠãããŠããããšãã
çæçãªè§£æ±ºçã¯ããããã¬ãŒããã«ãéããŠãã£ãã·ã¥ãã¯ãªã¢ããããšã§ãã
ããŒããããã§Clear site data
ã¯ãªãã¯ããåŸããåããšã©ãŒãçºçããŸãã Expo Developer Tools
ã¿ããšReact Native Debugger
ã¿ãã®äž¡æ¹ã§ãããè¡ããŸããã ãŸããææ°ããŒãžã§ã³ã®React Native Debugger
ã€ã³ã¹ããŒã«ããŠããŸãïŒ 0.11.5
ïŒã ç§ã¯ã©ããã§ã°ãããããšããããããããŸãããç§ã¯Expo 37 â> 39ããçŽæ¥ã¢ããã°ã¬ãŒãããŸãããç§ãåŸãŠããæ£ç¢ºãªãšã©ãŒã¯æ¬¡ã®ãšããã§ãã
Error: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639.js` from ``:
None of these files exist:
* debugger-ui/debuggerWorker.cff11639.js(.native|.native.expo.ts|.expo.ts|.native.expo.tsx|.expo.tsx|.native.expo.js|.expo.js|.native.expo.jsx|.expo.jsx|.native.ts|.ts|.native.tsx|.tsx|.native.js|.js|.native.jsx|.jsx|.native.json|.json|.native.wasm|.wasm|.native.svg|.svg)
* debugger-ui/debuggerWorker.cff11639.js/index(.native|.native.expo.ts|.expo.ts|.native.expo.tsx|.expo.tsx|.native.expo.js|.expo.js|.native.expo.jsx|.expo.jsx|.native.ts|.ts|.native.tsx|.tsx|.native.js|.js|.native.jsx|.jsx|.native.json|.json|.native.wasm|.wasm|.native.svg|.svg)
at ModuleResolver.resolveDependency ([redacted]/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
at ResolutionRequest.resolveDependency ([redacted]/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency ([redacted]/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
at [redacted]/node_modules/metro/src/lib/transformHelpers.js:267:42
at Server.<anonymous> ([redacted]/node_modules/metro/src/Server.js:841:41)
at Generator.next (<anonymous>)
at asyncGeneratorStep ([redacted]/node_modules/metro/src/Server.js:99:24)
at _next ([redacted]/node_modules/metro/src/Server.js:119:9)
ãŸããMetroãã³ãã©ãŒãã£ãã·ã¥ãã¯ãªã¢ããŠã¿ãŠãã ããïŒ expo start -c
ç§ã¯åãåé¡ã«ééããŸããããããŸã§ç§ã¯iOSã·ãã¥ã¬ãŒã¿ãŒã ãã§åããŠããŸãã
RNããŒãžã§ã³ïŒ
"react": "16.13.1",
"react-native": "0.63.3",
ç§ã«ãšã£ãŠããŸããã£ãã®ã¯ãã·ãã¥ã¬ãŒã¿ãŒããã¢ããªãå床ã€ã³ã¹ããŒã«ããããšã§ã
ä¿®çæžã¿ã
ãã®å
¬åŒã®ReactNative CLIã¬ã€ãã«åŸã£ãŠ4.13.1
ã¢ããã°ã¬ãŒãããŠãã ããã
ããã¯ReactNative0.62以éã§ã®ã¿æ©èœããããšã«æ³šæããŠãã ããã å€ãããŒãžã§ã³ã®åŸæ¹ä¿®æ£ã®èšç»ã¯ãããŸããã
Error: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639` from ``:
None of these files exist:
* debugger-ui\debuggerWorker.cff11639(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
* debugger-ui\debuggerWorker.cff11639\index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
yarn list --pattern @react-native-community/cli
ããã®åºåïŒyarn list v1.19.1
ââ @react-native-community/[email protected]
ââ @react-native-community/[email protected]
ââ @react-native-community/[email protected]
ââ @react-native-community/[email protected]
ââ @react-native-community/[email protected]
â ââ @react-native-community/[email protected]
ââ @react-native-community/[email protected]
ââ @react-native-community/[email protected]
ââ @react-native-community/[email protected]
ââ @react-native-community/[email protected]
@ rahamin1 @ satya164ã®æ瀺ãè©ŠããŸãããïŒ https://github.com/facebook/react-native/issues/28844#issuecomment-728233645ããã³https://github.com/facebook/react-native/issues/28844#issuecomment-728459236
@thymikeeäžèšã®ãã¹ãŠãè©ŠããŸãããã圹ã«ç«ã¡ãŸããã§ããã
@thymikee
@ rahamin1 @ satya164ã®æ瀺ãè©ŠããŸãããïŒ ïŒ28844ïŒã³ã¡ã³ãïŒãšïŒ28844ïŒã³ã¡ã³ãïŒ
ä»è©ŠããŠã¿ãŸããã å©ãã«ã¯ãªããªãã£ãã
Mobxã«ãã°ããããŸããã ãã®ãšã©ãŒã解決ããåŸãç§ã®åé¡ïŒãšã©ãŒïŒã¢ãžã¥ãŒã«./debugger-ui/debuggerWorkerã解決ã§ããŸããïŒã解決ãããŸããã
ä¿®çæžã¿ã
ãã®å ¬åŒã®ReactNative CLIã¬ã€ãã«åŸã£ãŠ
4.13.1
ã¢ããã°ã¬ãŒãããŠãã ãããããã¯ReactNative0.62以éã§ã®ã¿æ©èœããããšã«æ³šæããŠãã ããã å€ãããŒãžã§ã³ã®åŸæ¹ä¿®æ£ã®èšç»ã¯ãããŸããã
0.62.2ã§åäœããŠããŸãã
@kadiryakaã¯èšã£ãïŒ
Mobxã«ãã°ããããŸããã ãã®ãšã©ãŒã解決ããåŸãç§ã®åé¡ïŒãšã©ãŒïŒã¢ãžã¥ãŒã«./debugger-ui/debuggerWorkerã解決ã§ããŸããïŒã解決ãããŸããã
ç§ã®åé¡ãMobxã«é¢é£ããŠããã®ã§ã¯ãªãããšæããŸãããããã§ã®è§£æ±ºçã¯ããŸãããŸããããŸããã§ãããMobxã®åé¡ã«ã€ããŠäœãæŽå¯ãå ±æããŠããã ããŸããïŒ
ã°ããŒãã«ã«ã€ã³ã¹ããŒã«ãããreact-native-cliãåé€ããnpxã䜿çšããå¿ èŠããããŸãã
npm uninstall -g react-native
@react-native-community/cli
ãã¬ãã£ãã¯ã¹ä»ããšã³ããªãèŠã€ããŠãããããåé€ããŸãyarn install
/ npm install
npx react-native run-android
ç§ã®å Žåã¯åœ¹ã«ç«ããªãã£ãããã§ãïŒ https ïŒ
ç§ã®å Žåã¯åœ¹ã«ç«ããªãã£ãïŒ ïŒ28844ïŒã³ã¡ã³ãïŒ
ãã¶ããããã€ã¹/ãšãã¥ã¬ãŒã¿ãŒããã¢ããªãåé€ããŠã¿ãŠãã ããã ç§ã¯æã ãã®åé¡ãæ±ããŠããŸãããããŠã¢ããªãåé€ããããšã¯ãããïŒäžæçã«ïŒè§£æ±ºããŸã
è¿œå ãããã1ã€ã®ããšã¯ããã®åé¡ã¯ç§ã®åŽã®iOSã§ã¯äœãããªãããšã§ãããAndroidã§å®è¡ãããšãã¢ããªã¯å®å šã«ééã£ãåäœãããŸã
ããããšããã§ãäœåºŠãè©ŠããŸããã
ã¢ããªãšããã€ã¹ã®æ å ±ãåæããŠããšã©ãŒã®çç±ãèŠã€ããŸãã ããã€ã¹ã®æå»ãèªåã«èšå®ããåŸãããã€ã¹ã®æå»ãå®éã®æå»ããéããªããåé¡ã解æ¶ãããŸããã
ãŸã£ããåãåé¡ããããŸãã*ãlockãšnode_modulesãåé€ãããã¹ãŠãåã€ã³ã¹ããŒã«ããŸããã
ç§ã¯ãreact-nativeãïŒã0.63.4ããããã³react-native-community / cli4.13.1ã䜿çšããŠããŸã
ããããã»ãšãã©ã®å Žåããããã¬ãŒããªã³ã«ããŠãããžã§ã¯ãããªããŒãããããšãããšãã¯ã©ãã·ã¥ããŸãïŒå®éã®ããã€ã¹ãšãšãã¥ã¬ãŒã¿ãŒã§ïŒ:(
æãåèã«ãªãã³ã¡ã³ã
Chromeã®Reactãããã¬ãŒã¿ããããŒããªãã¬ãã·ã¥ïŒshift + refreshïŒããã€ã³ã¹ãã¯ã¿ãŒã§ã¢ããªã±ãŒã·ã§ã³ããŒã¿ãã¯ãªã¢ããæåŸã«bashã§ã¡ã€ã³ãã³ãã©ãŒã¹ã¬ãããåèµ·åããããšã§è§£æ±ºããŸããïŒnpm startïŒ