Question

我正在尝试将第二个文件导入到我的项目的App.js中。我收到错误“开发服务器返回了响应错误代码：500”。基本上说“无法从“ App.js”解析“ MainFile”。

为什么会这样？我相信它是正确的，但是出于某种原因，这个bugfest表示该文件不存在。第一个代码是我的App.js文件，第二个代码是我要导入的代码。

https://gyazo.com/6911c477f9c9e8149370571ca49a0b9f

https://gyazo.com/73f0079bc6a2640877bcc30fa1e609ec

import React from 'react';
import MainFile from './components/MainFile';


export default class App extends React.Component{
  render() {
    return(
      <MainFile />
    );
  }
}

import React from 'react';
import {StyleSheet, Text, View, TextInput, ScrollView, TouchableOpacity} from 'react-native';

export default class MainFile extends React.Component{
    render(){
        return(
            <View style={styles.container}>
                <Text>Testing</Text>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {

    },
});

Answer 1

仔细检查文件是否存在于给定路径
如果文件不是javascript（.js），请提及扩展名
在引用文件时尝试使用双引号（例如“ ./src /..”）
如果要导入的文件不是.js，请确保在首次导入时导入了适当的react库例如（从'react-native'导入{...，图片}）

Answer 2

删除node_modules文件夹
编辑程序包json：本机版本为“ 55.4”或“ 55.2”，并且 babel-preset-react-native设为“ 4.0.0”（如果您的版本不同尝试使用最新版本或降级。）
运行npm install或yarn install命令
您完成了

来源：Github

Answer 3

在我的情况下，我将./MainFile更改为./MainFile.js，并且开始工作。这应该在不指定扩展名的情况下工作。但是出了点问题，他需要它

为什么导入在本机反应中不起作用？

3 个答案: