석촌호수 벚꽃 축제는 다음주 수요일 부터인데 벚꽃은 이미 만개 한 듯하다.
평일 저녁 10시가 넘었는데도 젊은 사람들이 넘쳐나 걷기가 힘들 정도다.
[Error] Invariant Violation: requireNativeComponent: "RNSScreenStackHeaderConfig" was not found in the UIManager.
React-native 로 페이지 이동하는 것을 연습하는데 계속해서 위 제목과 같은 오류가 발생한다.
Navigating Between Screens 페이지에서 아래와 같이 설치하라고 한 것을 안했다는 이유로 종속성에 문제가 생긴 것이다. react-vativr-screens와 react-native-area-context를 install 하고 나니 정상적으로 실행된다.
> npm install react-native-screens react-native-safe-area-context
노트에는 Warning이 나올 수도 있다는 건데... Error 라니...
관련글
React-native App 생성 오류
react-native 로 App을 개발할 때 아래와 같은 명령으로 Typescript 템플릿으로 App을 생성시
$> npx react-native init AwesomeTSProject --template react-native-template-typescript
아래와 같은 오류가 발생
error An unexpected error occurred: "https://registry.yarnpkg.com/react-native-template-react-native-template-typescript: Not found".
info If you think this is a bug, please open a bug report with the information provided in "D:\\work\\reacttest\\AwesomeTSProject\\yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
yarn remove v1.22.19
[1/2] Removing module react-native-template-react-native-template-typescript...
error This module isn't specified in a package.json file.
info Visit https://yarnpkg.com/en/docs/cli/remove for documentation about this command.
warn Failed to clean up template temp files in node_modules/react-native-template-react-native-template-typescript. This is not a critical error, you can work on your app.
D:\work\reacttest\AwesomeTSProject\node_modules\metro-hermes-compiler\src\emhermesc.js:77
throw ex;
^
RuntimeError: abort(Error: Command failed: yarn add react-native-template-react-native-template-typescript). Build with -s ASSERTIONS=1 for more info.
at process.abort (D:\work\reacttest\AwesomeTSProject\node_modules\metro-hermes-compiler\src\emhermesc.js:402:15)
Nodejs, JAVA JDK를 새로 깔아도 오류가 계속 발생.
react-native-cli를 새로 설치하니 문제가 해결되었다.
$> npm uninstall react-native-cli
$> yarn global add @react-native-community/cli
$> npx react-native init AwesomeTSProject --templete react-native-typescript
React native App 개발 환경 구축
Windows환경에서 App 개발 환경 구축
iOS와 Android App을 같이 빌드하기 위해서는 Mac에서 환경을 구축해야 하겠지만 Mac이 없는 관계로 Windows환경에서 환경을 구축해 본다.
설치항목
- Chocolatey
- Node.js
- Python
- React Native CLI
- JDK
- Android Studio
- VisualStudio Code
설치
Chocolatiey 설치
Node.js 설치
Python 설치
다운로드 위치 : 파이썬 윈도우즈용 다운로드
React Native CLI 설치
Powershell을 관리자 모드로 실행
> choco install -y jdk8 실행
>
Android Studio 설치
다운로드 위치 : https://developer.android.com/studio
다운받아 설치
환경 변수 세팅
- 키보드에서 Win + Pause 버튼을 누른면 설정창이 나온다. 거기서 고급시스템 설정을 누른다.
- 시스템 속성에서 환경 변수(N).. 버튼 클릭
- 시스템변수에서 새로 만들기를 누르고 ANDROID_HOME 변수를 추가하고 위에서 설치한 디렉토리를 기재한다.
- 시스템 변수중 path 항목을 찾아 선택하고 편집 버튼을 눌러 환경 변수 편집 화면을 띄우고 거기서 새로 만들기를 눌러 platform-tools디렉토리를 path에 추가한다.
참고
Node.js 설치하기
Node.js 설치
설치환경 : Windows 11, x64
다운로드 위치 : https://nodejs.org/ko/
위의 다운로드 위치에서 최신 버전을 다운로드 한다.
라이센스 어그리먼트를 체크하고 다음으로
필요한툴들을 자동으로 설치하도록 옵션을 선택한다.
옵션을 바꿀려면 이전, 아니면 설치 버튼 클릭
Node.js가 설치된다.
Chocolatey, Python, Visualstudio2019-workload-vctools 등이 추가적으로 설치된다.
참조
