无法在React Native中导入其他组件

Question

最近，我开始学习如何使用React Native来构建移动应用程序，我从我的一位朋友那里听说过它，我对此非常感兴趣。 但是现在我遇到了错误，试图从谷歌搜索解决方案，但是没有一个可以解决我的问题。 我的问题是，当我将其他组件导入index.android.js时，它在移动屏幕上显示错误=>

开发服务器返回的响应错误代码：500

我的组件存储在android => android / app / components / Bar.js文件夹中

我像这样导入

从'./app/components/Bar'导入Bar；

index.android.js

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  View
} from 'react-native';

import Bar from './app/components/Bar';
export default class ProfilePageApp extends Component {
  render() {
    return (
      <View style={styles.container}>

          <Bar />

      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#000',
  }
});

AppRegistry.registerComponent('ProfilePageApp', () => ProfilePageApp);

Bar.js

import React, { Component } from 'react';
import {
  View,
  Text
} from 'react-native';


 class Bar extends Component {
  render() {
    return (
      <View style={styles.container}>

          <Text>Hello world</Text>

      </View>
    );
  }
}

export default Bar;

错误

Answer 1

我不确定RN在文件目录约定方面的工作原理，但我认为它与React等其他人几乎相同。 但是，当我阅读您的代码时，我认为您在import语句中缺少./android 。

您提到：

我的组件存储在android => android / app / components / Bar.js文件夹中

但是您是这样导入的：

import Bar from './app/components/Bar';

你有没有尝试过

import Bar from './android/app/components/Bar';

？