require cycle: src\components\Login\Login.tsx -> src\components\Login\index.ts -> src\c-CodePudding

What I am doing wrong and why I get the error message:

Require cycle: src\components\Login\Login.tsx -> src\components\Login\index.ts -> src\components\Login\Login.tsx

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.

const Login = () => {
 ...
};

export default Login;

Styles:

export const s = StyleSheet.create({...})

Model.ts

interface ILogin {
 test: boolean;
}

index.ts

import Login from "./Login";
import { ILogin } from "./Model";
import { s } from './Style';

export {
  Login,
  ILogin,
  s
};

can anyone pls help me to solve this issue ?

€: my imports in login:

import React from 'react';
import { Text, View, Image, Dimensions } from 'react-native';
import { Button } from '../Button';
import { Input } from '../Input';
import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
import LottoView from 'lottie-react-native';
import Ionicons from '@expo/vector-icons/Ionicons';
import Feather from '@expo/vector-icons/Feather';
import { InputStyles } from '../Input';
import { ButtonStyles } from '../Button';
import { globalStyles } from '../../shared/GlobalStyles';
import { useTranslation } from 'react-i18next';
import { useNavigation } from '@react-navigation/native';
import { ILogin } from './Model';
import { s } from './Style';

CodePudding user response：

The cycle means your login.tsx imports something from index.tsx/./, which in turn imports your login.tsx again. Therefore your login.tsx kind of depends on itself and to resolve the cycle, you should replace the import … from './' through explicitly importing the desired file instead.