Q&A
react-nativeにて、expoを使ったアプリ開発をしていますが、タイトルの通りのエラーが出ます。
react-navigationをインストールし、下記コードを記述した際にエラーが出ます。
eslintも導入し、何もコードミスが出ていないにも関わらず、エラーが出るので困っています。
教えてください!
App.jsx
react
1import React from 'react'; 2import { NavigationContainer } from '@react-navigation/native'; 3import { createStackNavigator } from '@react-navigation/stack'; 4 5import MemoListScreen from './src/screens/MemoListScreen'; 6 7const Stack = createStackNavigator(); 8 9export default function App() { 10 return ( 11 <NavigationContainer> 12 <Stack.Navigator> 13 <Stack.Screen name="Home" component={MemoListScreen} /> 14 </Stack.Navigator> 15 ); 16}
package.json
json
1{ 2 "name": "memoapp", 3 "version": "1.0.0", 4 "main": "node_modules/expo/AppEntry.js", 5 "scripts": { 6 "start": "expo start", 7 "android": "expo start --android", 8 "ios": "expo start --ios", 9 "web": "expo start --web", 10 "eject": "expo eject" 11 }, 12 "dependencies": { 13 "@expo/vector-icons": "^12.0.5", 14 "@react-native-community/masked-view": "^0.1.11", 15 "@react-navigation/native": "^5.9.8", 16 "@react-navigation/stack": "^6.0.11", 17 "@use-expo/font": "^2.0.0", 18 "expo": "~44.0.0", 19 "expo-status-bar": "~1.2.0", 20 "prop-types": "^15.8.1", 21 "react": "17.0.1", 22 "react-dom": "17.0.1", 23 "react-native": "0.64.3", 24 "react-native-gesture-handler": "~2.1.0", 25 "react-native-reanimated": "~2.3.1", 26 "react-native-safe-area-context": "3.3.2", 27 "react-native-screens": "~3.10.1", 28 "react-native-web": "0.17.1" 29 }, 30 "devDependencies": { 31 "@babel/core": "^7.12.9", 32 "eslint": "^8.6.0", 33 "eslint-config-airbnb": "^19.0.4", 34 "eslint-plugin-import": "^2.25.4", 35 "eslint-plugin-jsx-a11y": "^6.5.1", 36 "eslint-plugin-react": "^7.28.0", 37 "eslint-plugin-react-hooks": "^4.3.0" 38 }, 39 "private": true 40}
MemoListScreen.jsx
react
1import React from 'react'; 2import { View, StyleSheet } from 'react-native'; 3 4import AppBar from '../components/AppBar'; 5import MemoList from '../components/MemoList'; 6import CircleBtn from '../components/CircleBtn'; 7 8export default function MemoListScreen() { 9 return ( 10 <View style={styles.container}> 11 <AppBar /> 12 <MemoList /> 13 <CircleBtn name="plus" /> 14 </View> 15 ); 16} 17 18const styles = StyleSheet.create({ 19 container: { 20 flex: 1, 21 backgroundColor: '#f0f4f8', 22 }, 23});
他に必要な情報などありましたら、送付しますのでお声かけください。
よろしくお願いいたします。
回答1件
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。
2022/01/21 12:35
2022/01/21 15:22
2022/02/04 07:14