如何解决“动画:不支持useNativeDriver，因为缺少本机动画模块."在反应导航中? [英] How to resolve "Animated: `useNativeDriver` is not supported because the native animated module is missing." in react-navigation?
本文介绍了如何解决“动画:不支持useNativeDriver，因为缺少本机动画模块."在反应导航中?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在使用expo SDK版本36和所有平台(ios/android/web)
I am working on expo SDK Version: 36, and on all platforms (ios/android/web)
如文档中所述，首次安装react-navigation时并在运行jest --watch的同时执行以下操作，并出现以下警告:
When installing react-navigation for the first time as described in the documentation and running jest --watch while doing it, and the following warning appeared:
console.warn node_modules/react-native/Libraries/YellowBox/YellowBox.js:71
Animated: `useNativeDriver` is not supported because the native animated module is missing. Falling back to JS-based animation. To resolve this, add `RCTAnimation` module to this app, or remove `useNativeDriver`. More info: https://github.com/facebook/react-native/issues/11094#issuecomment-263240420
它也发生在浏览器控制台中:
It also happen in the browser console:
bundle.js:18272 Animated: `useNativeDriver` is not supported because the native animated module is missing. Falling back to JS-based animation. To resolve this, add `RCTAnimation` module to this app, or remove `useNativeDriver`. More info: https://github.com/facebook/react-native/issues/11094#issuecomment-263240420
in Card (at CardContainer.tsx:132)
in CardContainer (at CardStack.tsx:499)
in CardStack (at StackView.tsx:384)
in KeyboardManager (at StackView.tsx:382)
in Context.Consumer (at StackView.tsx:380)
in StackView (at StackView.tsx:41)
in StackView (at createStackNavigator.tsx:33)
in Anonymous (at createNavigator.js:80)
in Navigator (at createAppContainer.js:351)
in NavigationContainer (at AppCore.js:15)
in AppCore (at App.js:14)
in App (at withExpoRoot.web.js:13)
in ExpoRootComponent (at registerRootComponent.web.js:6)
in RootComponent
warn @ bundle.js:18272
r @ backend.js:6
shouldUseNativeDriver @ bundle.js:76326
TimingAnimation @ bundle.js:76894
start @ bundle.js:75709
start @ bundle.js:75715
Card._this.animate @ bundle.js:85843
componentDidMount @ bundle.js:85980
commitLifeCycles @ bundle.js:52243
commitLayoutEffects @ bundle.js:55486
callCallback @ bundle.js:30478
invokeGuardedCallbackDev @ bundle.js:30527
invokeGuardedCallback @ bundle.js:30582
commitRootImpl @ bundle.js:55224
unstable_runWithPriority @ bundle.js:92068
runWithPriority$2 @ bundle.js:42291
commitRoot @ bundle.js:55064
finishSyncRender @ bundle.js:54471
performSyncWorkOnRoot @ bundle.js:54449
(anonymous) @ bundle.js:42341
unstable_runWithPriority @ bundle.js:92068
runWithPriority$2 @ bundle.js:42291
flushSyncCallbackQueueImpl @ bundle.js:42336
flushSyncCallbackQueue @ bundle.js:42324
scheduleUpdateOnFiber @ bundle.js:53851
enqueueSetState @ bundle.js:44136
../../../react/cjs/react.development.js.Component.setState @ bundle.js:88125
_callee2$ @ bundle.js:1353
tryCatch @ bundle.js:90193
invoke @ bundle.js:90419
prototype.<computed> @ bundle.js:90245
tryCatch @ bundle.js:90193
invoke @ bundle.js:90283
(anonymous) @ bundle.js:90293
Promise.then (async)
invoke @ bundle.js:90292
(anonymous) @ bundle.js:90293
Promise.then (async)
invoke @ bundle.js:90292
(anonymous) @ bundle.js:90318
callInvokeWithMethodAndArg @ bundle.js:90317
enqueue @ bundle.js:90340
prototype.<computed> @ bundle.js:90245
../../../regenerator-runtime/runtime.js.exports.async @ bundle.js:90364
_callee2 @ bundle.js:1324
SplashScreen @ bundle.js:1537
constructClassInstance @ bundle.js:44346
updateClassComponent @ bundle.js:48555
beginWork$1 @ bundle.js:50328
beginWork$$1 @ bundle.js:55898
performUnitOfWork @ bundle.js:54837
workLoopSync @ bundle.js:54813
performSyncWorkOnRoot @ bundle.js:54412
(anonymous) @ bundle.js:42341
unstable_runWithPriority @ bundle.js:92068
runWithPriority$2 @ bundle.js:42291
flushSyncCallbackQueueImpl @ bundle.js:42336
flushSyncCallbackQueue @ bundle.js:42324
scheduleUpdateOnFiber @ bundle.js:53851
enqueueSetState @ bundle.js:44136
../../../react/cjs/react.development.js.Component.setState @ bundle.js:88125
onFinish @ bundle.js:1392
_callee$ @ bundle.js:18446
tryCatch @ bundle.js:90193
invoke @ bundle.js:90419
prototype.<computed> @ bundle.js:90245
tryCatch @ bundle.js:90193
invoke @ bundle.js:90283
(anonymous) @ bundle.js:90293
Promise.then (async)
invoke @ bundle.js:90292
(anonymous) @ bundle.js:90318
callInvokeWithMethodAndArg @ bundle.js:90317
enqueue @ bundle.js:90340
prototype.<computed> @ bundle.js:90245
../../../regenerator-runtime/runtime.js.exports.async @ bundle.js:90364
_callee @ bundle.js:18389
componentDidMount @ bundle.js:18470
commitLifeCycles @ bundle.js:52243
commitLayoutEffects @ bundle.js:55486
callCallback @ bundle.js:30478
invokeGuardedCallbackDev @ bundle.js:30527
invokeGuardedCallback @ bundle.js:30582
commitRootImpl @ bundle.js:55224
unstable_runWithPriority @ bundle.js:92068
runWithPriority$2 @ bundle.js:42291
commitRoot @ bundle.js:55064
finishSyncRender @ bundle.js:54471
performSyncWorkOnRoot @ bundle.js:54449
scheduleUpdateOnFiber @ bundle.js:53840
updateContainer @ bundle.js:57245
(anonymous) @ bundle.js:57670
unbatchedUpdates @ bundle.js:54575
legacyRenderSubtreeIntoContainer @ bundle.js:57669
render @ bundle.js:57750
renderApplication @ bundle.js:65334
run @ bundle.js:65227
runApplication @ bundle.js:65266
registerRootComponent @ bundle.js:18777
../../../expo/AppEntry.js @ bundle.js:14474
__webpack_require__ @ bundle.js:727
fn @ index.js:69
0 @ bundle.js:101987
__webpack_require__ @ bundle.js:727
(anonymous) @ bundle.js:794
(anonymous) @ bundle.js:797
Show 40 more frames
[Violation] 'requestAnimationFrame'
相关问题:
- https://github.com/expo/ex-navigation/issues/276
- https://github.com/facebook/react-native/issues/11094#issuecomment-263240420
- https://github.com/expo/ex-navigation/issues/276
- https://github.com/facebook/react-native/issues/11094#issuecomment-263240420
最后一个提供了一个解决方案，但是它说我在Linux Debian 10上时要打开Xcode，但是我没有Xcode.我可以使用Macbook并执行此步骤，但我想知道:
The last one offers a solution, but it says to open Xcode, while I am on Linux Debian 10. I do not have Xcode. I can use a Macbook and do the step but I am wondering:
- 在Linux上工作时我应该关心吗?
- 在Macbook上工作时是否应该关心(如果发生)?
- 在测试过程中，我应该维护应用程序的健康吗?在什么情况下?
推荐答案
禁用此警告
添加
jest.mock('react-native/Libraries/Animated/src/NativeAnimatedHelper');
或
jest.mock('NativeAnimatedHelp');
到您的测试文件
我将向您展示我的操作方式
我写在package.json
I write in package.json
"jest": {
"setupFiles": [
"./mock.js"
],
在模拟文件
jest.mock('react-native/Libraries/Animated/src/NativeAnimatedHelper');
jest.mock('NativeAnimatedHelp');
这篇关于如何解决“动画:不支持useNativeDriver，因为缺少本机动画模块."在反应导航中?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
