React-Native
-
[React-Native][Error] 리액트 네이티브에서 Gem::GemNotFoundException Error, Gem::FilePermissionError해결하기React-Native/Error 2023. 6. 6. 16:50
에러 해당 프로젝트에서 pod install을 했을때 발생한 오류입니다. 이 에러는 RubyGems가 cocoapods gem 을 찾을 수 없다는 것을 나타냅니다. 원인 1. cocoapods gem이 설치가 되어있지 않을 경우 2. cocoapods gem의 버전이 맞지 않을 경우 3. RubyGems가 cocoapods를 찾지 못하는 경우 해결방안 // 프로젝트 최상위 경로 $ bundle install $ gem install cocoapods // ios 경로 $ pod install bundle install OR gem install cocoapods 할 때 생길수 있는 오류 gem을 사용해서 문제를 해결할려고 했으나 아래와 같은 오류가 발생하였습니다. 아래의 오류는 gem의 권한에 관한 오류..
-
[JS] forEach 와 async/await 같이 사용하면 안되는 이유React-Native/javaScript 2023. 6. 3. 21:21
JS에서 forEach와 async/await를 같이 사용을 하니까 리턴된 값이 빈 값으로 나오는 에러가 발생하였습니다. 이유 빈 배열이 나온 이유는 비동기적인 동작을 제대로 처리하기 못하였기 때문에 위와 같은 현상이 발생하였습니다. JS에서 forEach 메서드는 콜백 함수를 동기적으로 실행하고, 비동기 작업을 기다리지 않고 다음 요소로 넘어갑니다. 그리고 async/await는 비동기적인 처리를 위한 문법이기 때문에 문제가 발생 할 수 있습니다. forEach 메소드 내부에 async/await를 사용하더라도 비동기 작업이 순서대로 처리되지 않고 병렬적으로 실행될 가능성이 높습니다. 해결 방안 for ... of 루프 나 for 루프를 사용하여 요소를 순차적으로 처리하는 것이 좋습니다. 위의 두개의 ..
-
[JS] Babel 이란?React-Native/javaScript 2023. 5. 28. 17:45
Babel이란? Babel은 자바스크립트의 최신 버전을 이전 버전과 호환되는 형태로 변환해 주는 도구입니다. 최신 자바스크립트 문법과 기능을 사용하여 코드를 작성할 수 있으며, Babel은 이를 이전 버전의 자바스크립트로 변환하여 구형 브라우저와의 호환이 되게 해주는 컴파일러 입니다. // Babel Input: ES2015 arrow function [1, 2, 3].map(n => n + 1); // Babel Output: ES5 equivalent [1, 2, 3].map(function(n) { return n + 1; }); Babel의 주요 기능 - 문법 변환 (Syntax Transformation) Babel은 최신 자바스크립트 문법을 지원하지 않는 환경에서도 코드를 실행할 수 있게 합니..
-
[React-Native][iOS][Error] Showing Recent Messages'/Users/hyeonsik/Library/Developer/Xcode/DerivedData/.../Build/Products/Debug-iphoneos/XCFrameworkIntermediates/FirebaseAnalytics/AdIdSupport/FirebaseAnalytics.framework/FirebaseAnalytics(FIRAEvent.o)' d..React-Native/Error 2023. 2. 13. 21:47
디바이스에 빌드하는 중에 빌드 실패와 같이 뜬 오류입니다. 해결방법 Xcode > 해당 프로젝트 > TARGETS > Build Settings > Build Options > Enable Bitcode를 NO로 바꿔준다. - 비트코드 란? 비트 코드는 컴파일 된 프로그램의 중간 표현입니다. 비트 코드를 포함하면 아이튠즈 커넥트에 업로드 앱은 컴파일 저장소에 연결됩니다. 비트 코드를 포함하면 애플 스토어에 앱의 새 버전을 제출할 필요 없이 미래에 앱 바이너리를 다시 최적화할 수 있고, iOS 앱의 경우 비트 코드 옵션은 선택 사항이고, watchOS 및 tvOS 앱의 비트 코드가 필수로 적용되어야 한다. - iOS Developer Library
-
[React-Native] dependencies VS devDependencies 차이React-Native 2023. 2. 11. 00:49
package.json에는 dependencies, devDependencies의 두 종류가 있습니다. dependencies는 라이브러리의 버전을 관리하는 곳입니다. 위의 두 개의 dependencies의 차이를 알아보겠습니다. dependencies - 설치 : npm install [라이브러리] - 애플리케이션의 동작과 관련된 라이브러리들 devDependencies - 설치 : npm install [라이브러리] -D, npm install [라이브러리] --save-dev - 애플리케이션의 동작과는 관련이 없음 - 개발할 때에만 사용하는 라이브러리 나누어둔 이유 dependencies의 라이브러리들은 배포할 때 포함이 되는 것들입니다. 배포할 때 사용하는 라이브러리들을 최소화하여 배포를 하면, ..
-
[React-Native][Android][Error] Execution failed for task ':react-native-safe-area-context:generateDebugRFile'. errorReact-Native/Error 2023. 2. 9. 19:25
터미널에서 react-native run-android 할 때 에러가 발생했습니다. 해결방안 android/build.gradle allprojects { repositories { google() exclusiveContent { filter { includeGroup "com.facebook.react" } forRepository { maven { url "$rootDir/../node_modules/react-native/android" } } } } 참고 https://stackoverflow.com/a/74470449 When I try to build for production this error comes up When I try to build for production, this err..
-
[React-Native][iOS][Error] Unknown configuration whitelisted: . CocoaPods found debug and release, did you mean one of these? 해결법React-Native/Error 2023. 2. 9. 15:02
pod install 하는 과정에서 발생한 에러입니다. 해결방안 node_modules/@react-native-community/cli-platform-ios/bulid/config/index.js 파일에서 102번째 줄을 아래와 같이 바꿔주면 됩니다. let configurations = []; if(userConfig) { configurations = userConfig.configurations || []; } 참고 https://stackoverflow.com/questions/74280201/unknown-configuration-whitelisted-cocoapods-found-debug-and-release-did-you Unknown configuration whitelisted: . ..
-
[React-Native][TypeScript] cannot be used as a JSX component. 해결법React-Native/typeScript 2023. 2. 5. 00:23
react native를 처음 타입스크립트로 프로젝트를 생성을 했는데 기본 컴포넌트들을 찾지 못한다는 error가 발생했습니다. 원인 node_modules/@types/react-native/node_modules/@types/react/index 파일에 들어가 보니 react 버전이 17로 되어 있었습니다. 그런데 package.json에는 react와 @types/react 버전이 18로 되어있다 보니 충돌이 생겨서 기본 컴포넌트를 불러오지 못하는 에러였습니다. 해결방안 package.json에서 react와 @types/react 버전을 17로 낮추고, 터미널에서 아래의 명령어를 수행하면 에러가 없어집니다. rm -rf node_modules package-lock.json npm install ..