Avertissement: "Les cycles obligatoires sont autorisés, mais peuvent entraîner des valeurs non initialisées. Pensez à la refactorisation pour supprimer le besoin d'un cycle."

Il existe généralement deux catégories d'avertissement de cycle: un de notre propre base de code, et un autre des packages node_modules tels que react-navigation-fluid-transitions. Dans ce cas, je pense que c'est du papier natif de réaction.

Nous pourrions à peine faire quoi que ce soit à propos du cycle require dans node_modules à moins que les auteurs du paquet ne le corrigent.

Mais vous souhaitez toujours conserver le paquet et ignorer l'avertissement:

import { YellowBox } from 'react-native'

YellowBox.ignoreWarnings([
  'Require cycle:'
])

YellowBox est obsolète, utilisez LogBox:

import { LogBox } from 'react-native';

LogBox.ignoreLogs([
    'Require cycle:'
])

malheureusement, l'avertissement "Les cycles requis sont autorisés" est toujours affiché dans les journaux

Vous pouvez accéder à chaque chemin et supprimer le cycle.

Par exemple, dans node_modules\react-native-paper\src\components\Checkbox\Checkbox.tsx , supprimez la référence de CheckboxItem .

Cependant, je ne sais pas quel en est l’impact.

Si plusieurs fournisseurs encapsulent votre application, assurez-vous que votre Provider importé de react-native-paper est bien au-dessus de la hiérarchie (il existe des exceptions comme le fournisseur de Redux).

J'avais plusieurs fournisseurs et je l'avais entre d'autres fournisseurs, ce qui, je pense, a créé des importations cycliques. Correction du problème lorsque je le déplaçais au-dessus de l'arborescence, juste en dessous du fournisseur de redux ().

import React from 'react';
import { StatusBar } from 'react-native';
import { Provider } from 'react-redux';
import { Provider as PaperProvider} from 'react-native-paper';
import { SafeAreaProvider } from 'react-native-safe-area-context';

import { store } from './your/reduxStore';
import { someTheme } from './your/apptheme';

const App = () => (
  <Provider store={store}>
    {/* Make sure react-native-paper provider is high up the tree */}
    <PaperProvider theme={muiTheme}>
      <SafeAreaProvider>
        <StatusBar translucent />
        {/* Your other App Stuff Here */}
      </SafeAreaProvider>
    </PaperProvider>
  </Provider>
);

export default App;

Je l'ai corrigé en important chaque composant séparément comme ceci:

import IconButton from 'react-native-paper/src/components/IconButton';

import Button from 'react-native-paper/src/components/Button';

faites de même partout où vous utilisez qc de react-native-paper