Javascript 反应导航、问题查找文件

我是一个全新的本地人，我正在努力解决一些基本问题，试图将我的应用程序划分为不同的文件（每个屏幕都有新文件），但我的导航器找不到屏幕或其他东西。我90%的确信这是一个非常基本的错误，但我已经被困在这个问题上一段令人尴尬的时间了

以下是错误：

“”找不到屏幕“详细信息”的“组件”、“getComponent”或“儿童道具”

我很确定我的导入/导出操作是正确的，但显然有些地方出了问题

代码：

//component import (app.js)

import { DetailScreen } from './screens/2nd';
...
...

//stack(app.js)

export default function App() {

  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName='home'>
        <Stack.Screen name='home' component={HomeScreen} />
        <Stack.Screen name='details' component={DetailScreen} />

      </Stack.Navigator>
    </NavigationContainer>
  );
}



//details page (2nd.js):

const DetailScreen = () => {
    return (
        <View>
            <Text>
                Detail Screen
        </Text>
        </View>
    )
}

export default DetailScreen;

//组件导入（app.js）
从“/screens/2nd”导入{DetailScreen}；
...
...
//堆栈（app.js）
导出默认函数App（）{
返回(
);
}
//详情页面（第2.js页）：
const DetailScreen=（）=>{
返回(
细节屏幕
)
}
导出默认详细信息屏幕；

更改

import { DetailScreen } from './screens/2nd'; 

到

---

当您声明

导出默认函数名时

您可以使用

从“/yourfile”导入别名函数

调用它。但是如果您想使用

导入{DetailScreen}…

您需要在/screens/2nd处声明

导出函数名

，我想这很简单，谢谢！

import  DetailScreen  from './screens/2nd';