프로젝트 오류
Error 1
Uncaught TypeError: Cannot read properties of null (reading 'classList')
원인 : HTML이 모두 로드 되기 전에 자바스크립트 영역에서 HTML을 참조하고 있기 때문에 오류 발생.
즉 addEventListener에서 HTML 태그를 참조할 수 없기 때문에 null을 참조하게 됐고 에러가 발생.
해결 방법 : window.onload = function(){} 함수를 사용해 웹 브라우저의 모든 구성요소에 대한 로드가 끝났을 때 브라우저에 의해 호출되는 함수 해당 부분에 넣으면 HTML을 모두 로드한 뒤에 함수를 호출한다.
window.onload=function(){
(생략)
}Error 2
'git' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않습니다.
기존 branch의 이름 Login을 Front로 바꾸려하자 터미널에 이와같은 오류가 발생
원인 : 이는 Visual Studio Code의 기본 터미널이 Windows의 Power Shell로 설정되어 있기 때문이다.
해결방법 : 기본 터미널의 종류를 cmd 또는 Git Bash로 변경하면 오류없이 실행이 가능하다.
이후 깃 branch 변경
1. 터미널 기본값을 bash로 변경
2. git branch -m before after
3. git push --set-upstream origin after
4. git push origin :before
Error 3
Warning: Each child in a list should have a unique "key" prop
원인 : map함수를 사용하면서 key값이 루트 컴포넌트에 적용되어야하는데 Fragment부분이 root map처리 되어버려 에러 발생
해결 : foot.map((a,i)=>
Footer 안에 고유의 값을 지정해줌.Error 4
This branch has conflicts that must be resolved
원인 : master branch에 merge를 할때 merge 과정에서 파일의 이름이 같으면 충돌이 발생한다. 파일이 다르면 무조건 자동으로 합쳐준다. 파일이 같아도 수정한 부분이 다르다면 자동으로 합쳐준다. 근데 파일이 같고, 수정한 부분이 같다면 충돌이 발생한다
$ git pull origin master
$ git merge --continue
$ git push origin 작업 브랜치Error 5
React_devtools_backend.js:4045 Warning: A future version of React will block javascript: URLs as a security precaution. Use event handlers instead if you can. If you need to generate unsafe HTML try using dangerouslySetInnerHTML instead. React was passed "javascript:void(0);".
원인 : 오래된 문법을 사용해서 React에서 버전에따라 경고출력
해결 : <a href="javascript:void(0);"></a>에서 a링크 대신 <Link></Link> 이용
Error 6
Plugin "react" was conflicted between ".eslintrc" and "BaseConfig
yarn.lock 삭제 후 yarn install
Parsing error: require() of ES Module
원인 : babel-eslint와 기존 eslint가 충돌을 해서 생기는 문제
npm uninstall babel-eslint
npm install eslint@4.x babel-eslint@8 - g
Error 7
Warning: Each child in a list should have a unique "key" prop
원인 : key값이 root 컴포넌트에 적용되어야 하는데 Fragment 부분이 root로 map처리 되어버려 Error발생
해결 : map 처리될 영역 내에 React Fragment를 제거
Error 8
Warning: A component is changing an uncontrolled input of type undefined to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component.
원인 : input value로 undefined가 들어감
해결 : state값을 input에 부여
