Can't run application with Moti and react-native 0.70 and React 18
pjadczak opened this issue · 4 comments
Is there an existing issue for this?
- I have searched the existing issues
Current Behavior
Project don't run, i have always error "ERROR Warning: Invalid hook call." and "ERROR TypeError: Cannot read property 'useContext' of null"
Code:
`import { View, StyleSheet} from 'react-native';
import { MotiView } from 'moti';
import React from 'react';
type MainProps = {
nr?: number,
}
const Comp: React.FC = ({ nr = 0 }) => {
return (
<View style={style.main}>
<MotiView
from={{
opacity: 0,
scale: 0.5,
}}
animate={{
opacity: 1,
scale: 1,
}}
transition={{
type: 'timing',
}}
style={style.mot}
/>
</View>
);
}
export default Comp;
const style = StyleSheet.create({
main: {
flex: 1,
},
mot: {
width: 300,
marginHorizontal: 20,
backgroundColor: 'red',
height: 20,
}
});`
current package.json:
{ "name": "midstone", "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 . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { "@bugsnag/react-native": "^7.18.0", "@miblanchard/react-native-slider": "^2.1.0", "@react-native-async-storage/async-storage": "^1.17.10", "@react-native-community/blur": "^4.2.0", "@react-native-community/hooks": "^2.8.1", "@react-native-community/masked-view": "^0.1.11", "@react-native-community/netinfo": "^9.3.5", "@react-native-community/push-notification-ios": "^1.10.1", "@react-native-firebase/app": "^15.7.0", "@react-native-firebase/messaging": "^15.7.0", "@react-navigation/drawer": "^6.5.0", "@react-navigation/native": "^6.0.13", "@types/react-native-push-notification": "^8.1.1", "moti": "^0.20.0", "react": "18.1.0", "react-native": "0.70.3", "react-native-gesture-handler": "^2.7.1", "react-native-push-notification": "^8.1.1", "react-native-reanimated": "^2.11.0", "react-native-safe-area-context": "^4.4.1", "react-native-screens": "^3.18.2" }, "devDependencies": { "@babel/core": "^7.12.9", "@babel/runtime": "^7.12.5", "@bugsnag/source-maps": "^2.3.1", "@react-native-community/eslint-config": "^2.0.0", "@tsconfig/react-native": "^2.0.2", "@types/jest": "^26.0.23", "@types/react": "^18.0.21", "@types/react-native": "^0.70.4", "@types/react-test-renderer": "^18.0.0", "@typescript-eslint/eslint-plugin": "^5.37.0", "@typescript-eslint/parser": "^5.37.0", "babel-jest": "^26.6.3", "eslint": "^7.32.0", "jest": "^26.6.3", "metro-react-native-babel-preset": "0.72.3", "react-test-renderer": "18.1.0", "typescript": "^4.8.3" }, "jest": { "preset": "react-native", "moduleFileExtensions": [ "ts", "tsx", "js", "jsx", "json", "node" ] } }
file babel.config.js:
module.exports = { presets: ['module:metro-react-native-babel-preset'], plugins: [ 'react-native-reanimated/plugin', ] };
Expected Behavior
Just correct render
Steps To Reproduce
No response
Versions
- Moti: 0.20.0
- Reanimated: 2.11.0
- React Native: 0.70.3Screenshots
Reproduction
+1