无法创建自定义 StackNavigator - "Couldn't register the navigator"？

Question

我正在尝试创建自定义 StackNavigator 并将其分发到自定义包中。问题是，当我想应用我的自定义堆栈时，出现以下错误：

Error: Couldn't register the navigator. Have you wrapped your app with 'NavigationContainer'?

这是我的 App.tsx:

import { createThemedStack } from '@my-custom-package' 

//this is the reference to my custom navigator
const ThemedStack = createThemedStack()

function App() {
  return (
    <NavigationContainer>
      <ThemedStack.Navigator>
        <ThemedStack.Screen name='Screen 1' component={Screen1} />
        <ThemedStack.Screen name='Screen 2' component={Screen2} />
        ...
      </ThemedStack.Navigator>
    </NavigationContainer>
  )
}

export default App

ThemedStack.tsx - 这里我想将一些自定义的通用样式应用到堆栈：

import * as React from 'react'
import { useNavigationBuilder, createNavigatorFactory, StackRouter } from '@react-navigation/native'
import { StackView } from '@react-navigation/stack'
// @ts-ignore
function ThemedStack({ initialRouteName, children, screenOptions, ...rest }) {
  const { state, descriptors, navigation } = useNavigationBuilder(StackRouter, {
    initialRouteName,
    children,
    screenOptions,
  })

  return <StackView {...rest} state={state} navigation={navigation} descriptors={descriptors} />
}

export default createNavigatorFactory(ThemedStack)

我做错了什么？我不明白。 ThemedStack 导航器位于 NavigationContainer 内。

我是根据 https://reactnavigation.org/docs/custom-navigators/ RN Navigation 文档做的，尽管他们没有说明在外部包结构中做这件事。

提前致谢:)

Answer 1

听起来你的包中有 @react-navigation/native 依赖项，这导致安装了多个版本。你应该把它移到 peerDependencies.