我正在尝试构建React Native Expo应用程序并收到此错误
错误:
Running application on Android SDK built for x86.
Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s%s, object, You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
Check your code at withExpoRoot.js:22.,
in ExpoRoot (at renderApplication.js:40)
in RCTView (at AppContainer.js:101)
in RCTView (at AppContainer.js:119)
in AppContainer (at renderApplication.js:39)
- node_modules/expo/build/environment/muteWarnings.fx.js:27:24 in error
- node_modules/react/cjs/react.development.js:172:36 in warningWithoutStack
- node_modules/react/cjs/react.development.js:612:32 in warning
- node_modules/react/cjs/react.development.js:1944:14 in createElementWithValidation
- node_modules/expo/build/launch/withExpoRoot.js:21:20 in ExpoRoot
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:10696:27 in renderWithHooks
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:13481:6 in mountIndeterminateComponent
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:20459:25 in beginWork$$1
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:19370:24 in performUnitOfWork
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:19347:39 in workLoopSync
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18997:22 in renderRoot
* [native code]:null in renderRoot
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18709:28 in runRootCallback
* [native code]:null in runRootCallback
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5642:32 in runWithPriority$argument_1
- node_modules/scheduler/cjs/scheduler.development.js:643:23 in unstable_runWithPriority
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5638:22 in flushSyncCallbackQueueImpl
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5627:28 in flushSyncCallbackQueue
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18556:30 in scheduleUpdateOnFiber
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:21822:15 in scheduleRootUpdate
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:23042:20 in ReactNativeRenderer.render
- node_modules/react-native/Libraries/ReactNative/renderApplication.js:52:52 in renderApplication
- node_modules/react-native/Libraries/ReactNative/AppRegistry.js:116:10 in runnables.appKey.run
- node_modules/react-native/Libraries/ReactNative/AppRegistry.js:197:26 in runApplication
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:436:47 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:111:26 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:384:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:110:17 in __guard$argument_0
* [native code]:null in callFunctionReturnFlushedQueue
这是我的代码:
api.js
export const fetchMeetups = () =>
fetch('http://localhost:3000/api/meetups')
.then(res => res.json());
App.js
import * as React from 'react';
import { Platform, StyleSheet, Text, View, ActivityIndicator } from 'react-native';
import { fetchMeetups } from './constants/api';
const instructions = Platform.select({
ios: `Press Cmd+R to reload,\nCmd+D or shake for dev menu`,
android: `Double tap R on your keyboard to reload,\nShake or press menu button for dev menu`,
});
class App extends React.Component{
static defaultProps = {
fetchMeetups
}
state = {
loading: false,
meetups: []
}
async componentDidMount(){
this.setState({loading: true});
const data = await this.props.fetchMeetups();
setTimeout(() => this.setState({loading: false, meetups: data.meetups}),2000)
}
render(){
if(this.state.loading){
return(
<ActivityIndicator size="large"/>
)
}
return (
<View style={styles.container}>
<Text>MeetupME</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});
index.js
import { registerRootComponent } from 'expo';
import App from './App';
// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
// It also ensures that whether you load the app in the Expo client or in a native build,
// the environment is set up appropriately
registerRootComponent(App);
答案 0 :(得分:1)
App.js似乎缺少默认的export。
index.js尝试导入默认导出(localSocket
),因此您只需将以下内容添加到App.js。例如,到文件末尾。
pc.localDescription