error: Error: Unable to resolve module ./styles from C:\Users\user\Desktop\project\project\src\Screens\OtpVerification\OtpVerifications.js:

Viewed 27

How can i fix this error i have done import the file but still that problem can anyone can tell how to fix this i just want to use my responsiveSize file in my otpverificaltion file earlier their was not error but after i want to test a function so i copy optveri code than test the function and than paste the same code as it was written earlier but now the error is coming the file was clear when i pasted my optveri code

error is

error: Error: Unable to resolve module ./styles from C:\Users\user\Desktop\project\project\src\Screens\OtpVerification\OtpVerifications.js:

None of these files exist:
  * src\Screens\OtpVerification\styles(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)
  * src\Screens\OtpVerification\styles\index(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)
   8 | import strings from '../../constatns/lang';
   9 | import navigationStrings from '../../constatns/navigationStrings';
> 10 | import { moderateScale,  } from '../../styles/responsiveSize';
     |                                      ^
  11 | import styles from './styles';
  12 | import OtpInputs from 'react-native-otp-inputs';
  13 | import actions from '../../reudx/actions';

My import code

//import liraries
import React, { Component } from 'react';
import { View, Text, StyleSheet, TouchableOpacity, Image } from 'react-native';
import HeaderComponent from '../../Components/HeaderComponent';
import HorizontalLine from '../../Components/HorizontalLine';
import WrapperContainer from '../../Components/WrapperContainer';
import imagePath from '../../constatns/imagePath';
import strings from '../../constatns/lang';
import navigationStrings from '../../constatns/navigationStrings';
import { moderateScale, moderateScaleVertical } from '../../styles/responsiveSize';
import styles from './styles';
import OtpInputs from 'react-native-otp-inputs';
import actions from '../../reudx/actions';

why i am using responsiveSize file

i am just using that because i want that the app screen ui can change according to the user phone size you can see the code also

import { Dimensions, StatusBar } from 'react-native';
const { width, height } = Dimensions.get('window');

const guidelineBaseWidth = 375;
const guidelineBaseHeight = 812;

const scale = size => (width / guidelineBaseWidth) * size;
const verticalScale = size => (height / guidelineBaseHeight) * size;
const moderateScale = (size, factor = 0.5) => size + (scale(size) - size) * factor;
const moderateScaleVertical = (size, factor = 0.5) => size + (verticalScale(size) - size) * factor;
const textScale = percent => {
    const screenHeight = Dimensions.get('window').height;
    //calculate absolute ratio for bigger screens 18.5:9 requiring smaller scaling
    const ratio = Dimensions.get('window').height / Dimensions.get('window').width;
    //Guideline sizes are based on standard ~5″ screen mobile device
    const deviceHeight = 375
        ? screenHeight * (ratio > 1.8 ? 0.126 : 0.15) //Set guideline depending on absolute ratio
        : Platform.OS === 'android'
            ? screenHeight - StatusBar.currentHeight
            : screenHeight;

    const heightPercent = (percent * deviceHeight) / 100;
    return Math.round(heightPercent);
};

export { scale, verticalScale, textScale, moderateScale, moderateScaleVertical,width,height };

img

0 Answers
Related