한빛

Invariant Violation: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

아직 mount 되지 않은 혹은 unmount 된 컴포넌트에 forceUpdate 나 setState 를 수행하려고 하면 아래와 같은 오류가 발생한다.

그래서 내가 삽질했다;

에러가 뜰리가 없는데, 자꾸 나서.. 하나씩 지워나갔는데 다 지워도 에러가 계속 뜨더라.

결국 import까지 하나씩 지워봤는데 react-base를 import하니까 에러가 뜬거였다 ㅂㄷㅂㄷ

버전도 낮춰보고 node_module 지우고 재설치하고 별걸 다해봤지만 해결되지 않았다.

https://github.com/facebook/react-native/issues/16332

그러다가 깃헙 이슈를 발견했는데 react-base의 image를 react-native의 image로 바꿔보랜다.

으엥 설마 이거겠어 했는데 잘됨,ㅋㅋ

공식문서를 찾아봤는데 react-base에 image가 없었다. 없어진건가? react-base의 image를 쓰는 글이나 유투브는 많았는데.

그리고 2차충격,  react-base 공식문서의 예제에서도 image를 react-native에서 임포트했다. 이래서 공식문서로 공부하라고 하는가부다

https://docs.nativebase.io/Components.html#Components

또는

could not connect to development server

잘되다가 갑자기 에러가떴다; 방화벽문제였음

굿바이 방화벽

===> sudo ufw disable

https://docs.expo.io/versions/latest/introduction/faq/#can-i-use-nodejs-packages-with-expo

Expo에서 Node.js 패키지를 사용할 수 있습니까?

패키지가 Node 표준 라이브러리 API 에 의존하는 경우 Expo와 함께 사용할 수 없습니다. 노드 표준 라이브러리는 파일 시스템을 읽고 쓰는 기능과 같은 JavaScript 언어 사양의 일부가 아닌 JavaScript에 기능을 제공하는 C ++에서 주로 구현되는 기능 집합입니다. React Native와 Expo Expo에서는 Chrome 및 Firefox와 같이 노드 표준 라이브러리를 포함하지 않습니다. 자바 스크립트는 모바일 앱 (우리의 경우)에서부터 서버 및 웹 사이트에 이르기까지 다양한 환경에서 사용되는 언어입니다. 이러한 컨텍스트에는 모두 자체 런타임 환경이 포함되어있어 상황에 맞는 의미에 따라 JavaScript에 다양한 API를 제공합니다.

참고로, 일부 노드 표준 라이브러리 API는 C ++ 확장에 의존하지 않고 대신 url 및 assert 와 같이 JavaScript에서 직접 구현할 수 있습니다 . 사용하려는 패키지가이 노드 API에만 의존하는 경우 npm에서 패키지를 설치할 수 있으며 패키지가 작동합니다.

==>그렇다고 한다.

firebase로 만들다가 백엔드 공부를 해보고싶어서 nodejs를 찾아봤는데 react-native에서 제공해주는 fetch api를 사용하는게 정신건강에 좋을꺼같다.

firebase 즐거웠어! 언젠가 다시보자~!!

https://medium.com/@ericmorgan1/upload-images-to-firebase-in-expo-c4a7d4c46d06

이 글을 참고했다.

expo imagepicker로 갤러리에 있는 uri를 받아오고 firebase에 이미지 업로드하려고 putFile을 호출했는데 자꾸 없덴다 ㅡㅡ

몇시간을 날렸는지 모르겠음; 분명 API문서에 있는 함수고, 사용법도 맞춰서 썼고, 버전도 다 최신꺼라 업데이트 할것도 없는데!! 왜이러는거야!!! 다른사람이 올린 예제 복붙했는데도 그런 함수 없다고 하고.. 하..

해결은 했지만 아직도 왜 안됬는지 모르겠다. putFile 안쓰고 그냥 put썼다 ㅡㅡ

const response = await fetch(this.state.profile_image);

const blob = await response.blob();

imagesRef.put(blob);

putFile쓰는 사람은 어떻게 한거야?!!!

npm ERR! path /home/limenju/react-native-project/dateApp/node_modules/react-native-facebook-login
npm ERR! code EISGIT
npm ERR! git /home/limenju/react-native-project/dateApp/node_modules/react-native-facebook-login: Appears to be a git repo or submodule.
npm ERR! git     /home/limenju/react-native-project/dateApp/node_modules/react-native-facebook-login
npm ERR! git Refusing to remove it. Update manually,
npm ERR! git or move it out of the way first.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/limenju/.npm/_logs/2019-07-11T07_01_31_358Z-debug.log

npm으로 뭐 설치할때마다 .git이랑 충돌난다.

내경우에는,

node_modules/react-native-facebook-login/.git 파일을 삭제해주고 설치하려고 했던 모듈을 재설치해주면 잘된다.

우분투를 설치하고 한글 입력이 안되서 IBUS로 설정했다.

한글 입력은 잘됬지만 visual studio code에서는 한글 입력이 안되었고 UIM으로 변경했다.

UIM 으로 변경하기

http://progtrend.blogspot.com/2018/06/ubuntu-1804-uim.html

프로젝트를 하려고 visual studio code를 켰는데 이상한점이 발견됬다.

내 프로젝트 폴더는 관리자 권한이 있어야 저장 가능한데, 관리자 권한으로 visual studio code를 키면 한글 입력이 안됬다.

권한없이 visual studio code를 키면 한글이 잘 써진다.

왜 이런 차이가 있나.. 궁금했지만 한글로 구글링해보니 나와 유사한 사람을 찾지 못했고 영어로 한글 입력에 대한걸 검색해봤자 딱히 이유를 찾지 못할것같아서 그냥 프로젝트 폴더 권한을 내렸다.

$ sudo chown -R <user-name> <directory-name>

끝! 이제 내 프로젝트에 한글 입력이 잘된다!

요며칠 삽질만 엄청 많이하고있다.

1. expo 무한빌드 -> expo optimize 하라고 경고뜸

2. expo optimize 입력 -> 에러뜸 (This command requires version 1.10.0 of `sharp-cli`. 
You can install it using `npm install -g sharp-cli@1.10.0`. 

For prerequisites, see: https://sharp.dimens.io/en/stable/install/#prerequisites)

3. npm install -g sharp-cli@1.10.0 입력 -> ERR! sharp EACCES: permission denied, open '/usr/lib/node_modules

4. sudo npm install --unsafe-perm -g expo-cli 입력해서 해결 -> sharp설치 됨, 무한빌드 해결됨

sudo expo start --no-dev --minify

로 시작하면 된다. 솔직히 이건 왜뜨는건지 잘.. 모르겠다.