Question

我奇怪地发现React Native无法解析本地文件导入的错误。

Unable to resolve module `./components/MyComponent" from ".//App.js`: could not resolve `/Users/myusername/Desktop/mylibrary/components/MyComponent' as a file nor as a folder","name":"UnableToResolveError","type":"UnableToResolveError","errors":[{}]},"type":"bundling_error"}"

在MyLibrary / App.js：

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

import MyComponent from './components/MyComponent';

在MyLibrary /组件/ MyComponent.jsx：

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

export default class MyComponent extends React.Component {

    render() {
        <View>
            {this.props.children}
        </View>
    }
}

我尝试将文件重命名为小写（mycomponent.jsx），但没有什么区别。我也尝试重新启动我的模拟器并重置缓存，它也没有帮助。

Answer 1

import语句默认尝试导入.js个文件，尝试将MyComponent.jsx重命名为MyComponent.js。

引用MDN：

要从中导入的模块。这通常是包含模块的.js文件的相对或绝对路径名，不包括.js扩展名。某些捆绑商可能允许或要求使用扩展;检查你的环境。只允许使用单引号和双引号字符串。

Answer 2

组件错误。您没有在render方法中返回任何内容。试试这个：

render() {

return(
        <View>
            {this.props.children}
        </View>
)
    }

无法解析本地文件的模块（React Native）

2 个答案: