EncryptedStorage import 오류가 발생합니다.
환경:
Macbook Air M2 Sonoma
VS-Code
RN v0.74.1
Metro v0.80.8
문제:
아래 명령어로 라이브러리 설치 및
pod install과정은 모두 완료한 상태입니다.$ yarn add react-native-encrypted-storage$ npx pod-install ios/frontend/utils/encryptStorage.ts에서EncryptStorage라이브러리를 불러올 때 다음과 같은 경로로 불러와집니다. 자동완성 기준으로 불러왔으며, 라이브러리 삭제 후 재설치해도 현상은 같습니다.import EncryptedStorage from 'react-native-encrypted-storage/lib/typescript/EncryptedStorage';이 경로로 importing된 라이브러리를 파일 내에서 사용하면 정상적으로 메서드가 자동완성 됩니다. (따라서 코딩할 때에는 문제가 되는지 몰랐습니다)

이 코드를 바탕으로 앱 실행 시 react-native-encrypted-storage모듈을 불러올 수 없다는 오류가 발생합니다.

error: Error: Unable to resolve module react-native-encrypted-storage/lib/typescript/EncryptedStorage from /Users/popo/Desktop/ClipProjects/frontend/src/utils/encryptStorage.ts: react-native-encrypted-storage/lib/typescript/EncryptedStorage could not be found within the project or in these directories: node_modules 1 | import EncryptedStorage from 'react-native-encrypted-storage/lib/typescript/EncryptedStorage'; | ^ 2 | 3 | const setEncryptedStorage = async <T>(key: string, value: T) => { 4 | await EncryptedStorage.setItem(key, JSON.stringify(value));해당 모듈 외 문제는 없는 상황 같습니다. 서버 연결 및 응답(로그인, 회원가입에 대해)은 잘 됩니다.
시도해본 것:
import EncryptedStorage from 'react-native-encrypted-storage/lib/typescript/EncryptedStorage';를
import EncryptedStorage from 'react-native-encrypted-storage'; 로 바꿔 실행해봤는데, 컴파일 오류는 발생하지 않고 로그인 및 회원가입 시점에 eject가 발생합니다.
질문: 왜 이런 문제가 발생하는 것이며, 어떻게 해결할 수 있을까요?
답변 1
0
eject이 발생한다는게 무슨말씀이신가요?
react-native-encrypted-storage
로 임포트하시고 앱을 삭제하고 다시 빌드해보시겠어요?
0
eject가 아니고 reject입니다 죄송합니다!
알려주신 방법을 시도해봤지만, 해당 방법으로 앱 실행 시 Promise rejection이 발생합니다.
import EncryptedStorage from 'react-native-encrypted-storage/';
const setEncryptedStorage = async <T>(key: string, value: T) => {
await EncryptedStorage.setItem(key, JSON.stringify(value));
};
const getEncryptedStorage = async (key: string) => {
const value = await EncryptedStorage.getItem(key);
return value ? JSON.parse(value) : null;
};
const removeEncryptedStorage = async (key: string) => {
const value = await EncryptedStorage.getItem(key);
if (value) {
await EncryptedStorage.removeItem(key);
}
};
export {setEncryptedStorage, getEncryptedStorage, removeEncryptedStorage};EncryptedStorage를 절대 경로로 import 했고, 이 코드를 기반으로 앱을 실행하면 컴파일 에러는 발생하지는 않습니다.
단, EcryptedStorage를 사용하는 코드가 실행되면 promise reject 및 storage 저장이 실행되지 않습니다. 아래 사진은 회원가입된 계정으로 로그인 시 removeItem 메서드에 대한 Promise reject 에러입니다.

즉,
import EncryptedStorage from 'react-native-encrypted-storage/';로 라이브러리를 불러오면 앱 실행 자체는 되지만(컴파일 에러 발생 X), EncryptedStorage 메서드를 사용하는 트리거(로그인) 발생 시 Promise reject가 발생하며 해당 라이브러리가 제대로 작동하지 않습니다.import EncryptedStorage from 'react-native-encrypted-storage/lib/typescript/EncryptedStorage';로 import 하면(import문 입력 시 자동완성에 해당 경로밖에 없습니다) 앱 실행 시 컴파일 에러가 발생하면서 실행 자체가 되지 않습니다.

Unable to resolve module react-native-encrypted-storage/lib/typescript/EncryptedStorage from /Users/popo/Desktop/ClipProjects/frontend/src/utils/encryptStorage.ts: react-native-encrypted-storage/lib/typescript/EncryptedStorage could not be found within the project or in these directories: node_modules > 1 | import EncryptedStorage from 'react-native-encrypted-storage/lib/typescript/EncryptedStorage'; | ^ 2 | 3 | const setEncryptedStorage = async <T>(key: string, value: T) => { 4 | await EncryptedStorage.setItem(key, JSON.stringify(value)); RCTFatal __28-[RCTCxxBridge handleError:]_block_invoke _dispatch_call_block_and_release _dispatch_client_callout _dispatch_main_queue_drain _dispatch_main_queue_callback_4CF __CFRUNLOOP_IS_SERVICING_THE_MAIN_DISPATCH_QUEUE__ __CFRunLoopRun CFRunLoopRunSpecific GSEventRunModal -[UIApplication _run] UIApplicationMain main start_sim 0x0 0x0
1
깃헙에 제공해주시는 코드 보고 리팩토링 했더니 해결이 됐습니다. 강의 보면서 함수명이라든가 조금 바꿔서 진행하다보니 syntax error가 발생했던 거 같습니다 답변 감사합니다!
react-native-screens 버전 호환 문제
2
153
1
안드로이드 실행 중 Drawer네비게이션과 MapView 성능 문제
0
103
2
해당 강의 부분은 실제 활용하기에 부족해 제가 해결한 방법입니다.
0
96
1
소스코드가 강의 순서랑 다른가요?
0
72
2
현재 Windows에서 VsCode로 작업 중인데 추후에 IOS도 가능하게 하려면
0
115
2
react-native-fast-image는 react 19 버전에서 설치가 안되나요?
0
209
2
SQL Shell의 역할이 무엇인가요?
0
91
1
혹시 해당 강의에서invalidateQueries를 사용한 이유가 있을까요?
0
79
2
빠르게 실행해보고싶습니다.
0
82
1
강의 수강 순서 관련
0
70
1
애뮬레이터 실행 방법
0
99
2
무료 Apple ID로 실기기 테스트 가능한가요?
0
90
2
ios 실기기 연결
0
70
2
npm run ios에러
0
74
1
10월 삭제 예정인 강의는 이유를 알 수 있을까요?
0
101
1
캘린더 개발 후에 navigation 에 대해서 궁금한 점이 있습니다.
0
51
1
안드로이드 위치 권한 이슈 2가지 문의
0
71
1
지도가 보이려면 음.. 작성해주신 스타일과 다르게
0
74
0
제대로 설치한거같은데 안드로이드랑 ios 둘다 앱실행이 안되는것같아요
0
83
3
강의 내용을 보면 전체적으로 function 함수 키워드를 사용하시는데
0
69
2
강의 3-9 에서 useGetRefreshToken 훅 안에 즉시 함수로 처리하는 이유가 궁금합니다!
0
82
2
사내에서 figma.com 업로드 안되나요?
0
96
1
AWS EC2 + RDS 설정
0
85
2
안드로이드 안켜집니다.
0
91
2





