React Native with TypeScript Error无法解析模块

Question

我刚刚使用 React Native Typescript 模板创建了一个新项目。但是我发现当我导入一个新组件时，它会抛出以下错误。我的新组件位于src/screens/HomeScreen.tsx

error: Error: Unable to resolve module `src/screens/HomeScreen` from `App.tsx`: src/screens/HomeScreen could not be found within the project.

如果我在 App.tsx 中内联相同的组件，那么它工作得很好。但是从另一个文件导入会导致此问题。我试图删除并重新创建问题，但仍然发生。

有人可以帮我解决这个问题吗？提前致谢

App.tsx

import React from 'react';
import {
  SafeAreaView,
  StyleSheet,
  ScrollView,
  View,
  Text,
  StatusBar,
} from 'react-native';
import HomeScreen from 'src/screens/HomeScreen';

const App = () => {
  return (
      <HomeScreen/>
  );
};

export default App;

HomeScreen.tsx

import React from 'react'
import {Text} from 'react-native'

const HomeScreen = (): any => {
    return (
        <>
            <Text>test </Text>   
        </>
    )
}

export default HomeScreen

文件夹结构

Answer 1

问题是HomeScreen 的绝对路径导入。您可以简单地将其更改为

import HomeScreen from './src/screens/HomeScreen';

它应该可以工作。你可以找到更多here。