# warning

43개의 포스트
post-thumbnail

Node: SCRIPT DEPRECATION WARNING 해결

서론 평소에 Node를 설치할 때 아래 명령어를 입력했다. 그런데 이런게 떴다. 링크타고 가서 확인해보자. 본론 1. 왜 deprecation 됐나요? 요약: 특정 버전에 대한 설치 프로그램을 패키지 하지 않음. 더 좋은 방법 찾음. 이렇게 하셈 2. 그래서 어떻게 설치하는데? 2-1) node source gpg key 설치 2-2) repository 생성 첫 줄에 원하는 버전을 넣는다. (저는 20버전으로 하겠습니다.) 2-3) Update하고 Ins

약 23시간 전
·
0개의 댓글
·

Warning: validateDOMNesting(...): <p> cannot appear as a descendant of <p> 해결하기

문제 사이드 프로젝트로 열코하던 중에, 작동은 잘 되지만 warning이 뜬 이슈가 있었다. 태그 안에 태그가 자손으로 들어갈 수 없다는 뜻! 내 코드는 대충, 이런 구성이였는데 인라인레벨 태그안에 블록레벨 태그가 들어가면 안된다는 것은 알았지만, 블록레벨 태그인 태그 안에 another 태그가 또 들어가면 안된다고?! 일단은 알겠는데, 이유를 찾아봐야 겠어서 구글링을 해보았다. 아무래도 HTML standard 관련 이유 같다. 이유 태그는 기본적으로 문단(paragraph)을 정의하는 태그이다. 문단의 시작과 끝을 정한다. HTML 규격상, 태그 내에 또 다른 태그가 금지되어 있다. 웹 브라우저가 렌더링할 때, 중첩된 는 뒤로 빼서 렌더링하게 된다. 예를 들어, 아래처럼 코딩하더라도 👇🏻 렌더링은, 웹 브라우저의 처리 기준에 맞춰 이런 코드로 자동보정된다. 중첩되지 말아야 할 태그가 나오면, 앞서 나온 를 닫아버리고, 중첩된 태그

2023년 8월 28일
·
0개의 댓글
·
post-thumbnail

Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. ~

어느 순간 나타난 warning. _React.DOM.Render는 React 18 버전에서 더 이상 지원되지 않음. 대신 createRoot를 사용할 것. 새 API로 변환 전까지 앱은 React 17 버전처럼 동작함._ 기존 콘솔에 찍히지 않던 처음 보는 워닝을 발견해 해결함. 리코일 혹은 리액트쿼리를 사용하면서 인덱스 파일을 수정했고, 그 사이 착오로 코드를 잘못 수정한듯함. 기존 index파일 수정한 index 파일 차이점 ReactDOM 을 import 해오는 디렉토리의 구조 변경 (17: react-dom -> 18: react-dom/client) createRoot를 사용할 것 (17: ReactDom.rend

2023년 8월 17일
·
0개의 댓글
·

styled-component props error 해결

지원한 회사의 사전 과제를 하던 중.. 어떠한 에러도 만들지 않겠다고 다짐하는 순간 나타난 Error..... 어떤 오류 였을까? 일단 기능에는 문제 없는 에러였지만 고치면 개발자도구가 깔끔해질 것 같은 느낌이라 고쳤습니다.. 저와 같이 답답한 사람은 절 보고 고치시길..! > Warning: React does not recognize the currentMonth prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase currentmonth instead. If you accidentally passed it from a pa

2023년 7월 25일
·
0개의 댓글
·
post-thumbnail

The serializable class does not declare a static final serialVersionUID field of type long 해결

🏋🏻‍♀️ 사건(?) 개요 최근 Spring 학습을 진행하면서 위의 사진과 같은 Warning Message가 발생했고, 어떤 것 때문에 발생했고, 해결 방법은 무엇인지 찾아보고 학습한 내용을 글로 기록하고자 합니다. 🎱 문제 원인(feat. 직렬화) 먼저 가장 강렬하고(?) 직관적으로 보이는 단어가 Serializable 입니다. 이는 직렬화로 해석할 수 있고, 이를 간단하게 설명하면 아래와 같습니다. 직렬화 Java 시스템 내부에서 사용되는 객체 혹은 데이터를 외부의 Java 시스템에서도 사용할 수 있도록 변환하는 과정을 의미 Byte 형태의 데이터로 변환 역직렬화 Btye 형태의 데이터를 다시 객체로 변환하는 과정을 의미 cf) 직렬화를

2023년 7월 17일
·
2개의 댓글
·
post-thumbnail

React 오류) Received 'false' for a non-boolean attribute 'isactive'

문제 인지 styled-components에 prop를 전달하는 도중 발생한 오류이다. 오류를 확인해보니 다음과 같았다. > 경고: 부울이 아닌 특성 'is active'에 대해 'false'를 받았습니다. DOM에 쓰려면 isactive="false" 또는 isactive={value.toString()} 문자열을 대신 전달합니다.> 해석하자면 boolean 타입이 아닌 특성에 대해서 boolean 값을 받았으니 DOM에 쓸려면 문자열로 바꾸어서 값을 전달해라. 해결 방법 생각 나의 코드는 다음과 같다. 코드를 살펴보니 Tab이라는 styled-component에 형식으로 prop이 전달되는것을 확인할 수 있다. 오류를 해석한 바로는 DOM에서 사용하려면 boolean 형식이

2023년 5월 25일
·
0개의 댓글
·

Warning: ReactDOM.render is no longer supported in React 18.

Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17 경고: ReactDOM.render는 React 18에서 더 이상 지원되지 않습니다. 대신 createRoot를 사용하세요. 새 API로 전환할 때까지 앱은 React 17을 실행하는 것처럼 작동합니다. 리액트 앱의 버전은 React 18이지만, 사용하고 있는 코드는 React 17을 사용하고 있기 때문에 발생한 것이다. ReactDOM.render를 리액트 v18부터 사용하지 않기 때문에 나타나는 경고 메세지이다. 기존 코드 변경 코드

2023년 5월 22일
·
0개의 댓글
·
post-thumbnail

createGlobalStyle 경고

createGlobalStyle 를 통해 global하게 css적용 시킬 때 createGlobalStyle 에 @import(폰트)를 사용하면 do not use @import라는 경고 문구가 뜬다. 경고문구를 해석해보면 > createGlobalStyle.ts:40 현재 createGlobalStyle에서 @import CSS 구문을 사용하지 마십시오. 프로덕션에서 사용하는 CSSOM API가 이를 잘 처리하지 못합니다. 대신, 일반적인 메타 태그를 스타일시트에 삽입하거나, 더 간단한 앱을 위해 index.html 섹션에 수동으로 삽입하는 것이 좋습니다. react-helmet이라는 라이브러리를 사용하지 않고 link를 통해 수동으로 해결해보기로 했다. 방법 reset.css ![](https://velog.velcdn.com/images/tjdwns6522/post/8f72ef30-ef74-436d-90d8-6663ff77730

2023년 5월 18일
·
0개의 댓글
·
post-thumbnail

Git add . (LF, CRLF)

문제 : > git add . 를 하는데 warning 이 발생 원인 : > 유닉스 계열 시스템에서는 LF(Line Feed)를 사용하고, 윈도우 시스템에서는 CRLF(Carriage Return, Line Feed)를 사용하기 때문에 개행 문자가 다르게 처리된다고 함. 방법 : > 개행 문자를 자동으로 처리하도록 설정했다. 경고 메시지가 거슬리기도 하고 호환성 문제도 생길 수 있다고 하여 true 로 설정해 주었다. 해결 : 이 warning은 처음 팀 프로젝트를 진행하면서 만났었는데, Mac OS 환경에서 개발하는 팀원이 있고, Windows OS를 사용하는 팀원이 있을 때 발생했다. 🤭

2023년 5월 8일
·
0개의 댓글
·
post-thumbnail

🚧[DOM] Input elements should have autocomplete attributes (suggested: "current-password"):🚧

❗ 문제 내용 form 태그 워닝을 해결했더니 나타난 워닝 😮 input 요소는 autocomplete 속성을 가져야 하고, "current-password" 를 추천한다는 메시지가 나와 있다! 찾아보니까 크롬 브라우저가 아니면 해당 문제는 발생하지 않으며, 크롬에서는 모든 비밀번호와 form data 를 자동 저장 및 자동 완성 하려고 하기 때문에, 웹 개발자에게 브라우저에 더 편리한 양식 요소 범위를 준수하라고 권고해서 위와 같은 워닝이 뜨는 거라고 한다...! 🛠 문제 해결 autocomplete 는 사용자가 이전에 입력했던 것을 참고하여 자동완성을 시켜줄지 여부를 결정하는 속성으로, 나 같은 경우에는 그냥 off로 설정해 줬다. 이렇게 해주면 워닝은 사라진

2023년 5월 5일
·
0개의 댓글
·
post-thumbnail

🚧[DOM] Password field is not contained in a form:🚧

앞으로 내가 만나게 되는 모든 오류를 정리하는 카테고리를 하나 만들었다 ㅎ.ㅎ 나도 구글링에서 많은 도움을 받으니까 내 정리글도 누군가에게 도움이 많이 되었으면 좋겠다... 🥰 ❗ 문제 내용 첫 포스팅이니까 간단한 워닝을 해결한 사례를 적어보려고 한다😊 로그인 폼을 구현하다가 만난 warning! 나는 warning 을 고쳤다가 문제가 해결되는 경우도 많았어서(C 프로그램 이야기지만...) warning 도 되도록이면 다 고치고 콘솔을 깨끗하게 만드는 편이다... 이 warning 은 단순히 password 필드가 form 태그로 감싸져 있지 않을 때 발생한다 ! 🛠 문제 해결 단순히 input 을 form 태그로 감싸주기만 하면 warning 을 해결할 수 있다 �

2023년 5월 5일
·
0개의 댓글
·
post-thumbnail

[Warning] UserWarning: Glyph 8722 (\N{MINUS SIGN}) missing from current font.

⚠️Warning Code 마이너스 부호 때문에 한글이 깨졌다. > UserWarning: Glyph 8722 (\N{MINUS SIGN}) missing from current font. 마이너스 깨짐 방지 마이너스 때문에 한글이 깨져 경고 발생 및 마이너스에 ㅁ처리가 되었다. 💡해결 방법 아래 코드를 작성해주면 된다. ![](https://velog.velcdn.com/images/zer0/post/3e1d1d6e-7bf0-4512-bbc1-890104dbc

2023년 3월 31일
·
0개의 댓글
·
post-thumbnail

[warning] Array.prototype.map() expects a return value from arrow function.

warning Array.prototype.map() expects a return value from arrow function. 개발 도중 다음과 같은 경고가 발생했다. map 함수 사용 시 return 구문이 없어서 발생한 경고였다. 위 경고는 아래 방법으로 해결이 가능했다. 상황에 맞게 편한 방법을 사용하자. > 참고 https://velog.io/@ylyl/TIL-Warning-arrow-function-return-value

2023년 3월 26일
·
0개의 댓글
·
post-thumbnail

[Github] WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED! 에러 해결

github에 commint한 내용을 push하려고 했을때 발생한 에러 23.03.24일 github에서 RSA SSH 호스트키를 업데이트해서 발생한 에러이다. RSA를 사용하는 SSH를 통한 Git 작업에만 영향을 미치고, ECDSA 또는 Ed25519 사용자에게는 영향이 없다고 한다. 해결방법 ~/.ssh/known_hosts 파일의 github.com 항목을 아래 정보로 업데이트 하면 해결된다. . . . 참고 https://github.blog/2023-03-23-we-updated-our-rsa-ssh-host-key/

2023년 3월 25일
·
0개의 댓글
·
post-thumbnail

Warning: Using UNSAFE_componentWillReceiveProps in strict mode is not recommended and may indicate bugs in your code.

Warning Warning: Using UNSAFE_componentWillReceiveProps in strict mode is not recommended and may indicate bugs in your code. See https://reactjs.org/link/unsafe-component-lifecycles for details. Solution strict 모드에서는 componentWillReceiveProps 는 권장되지 않는다는 경고였다. strict 모드는 애플리케이션 내의 잠재적인 문제를 알아내기 위한 도구로, npx를 사용해서 리액트 앱을 생성하게 되면 자동으로

2022년 11월 24일
·
0개의 댓글
·

[WARNING] expects a value to be returned at the end of arrow function

props로 받은 배열형 데이터를 map()으로 호출하고 반환 프로젝트에 관한 내용은 구조가 같고 추후에 수정 또는 추가가 되는 부분이기 때문에 카드형으로 컴포넌트를 생성하고, 경로 이동 또는 모달형식으로 프로젝트 소개글을 넣었다. 구조 > App js > Router, fetch를 이용하여 데이터를 호출 => Main컴포넌트내에 데이터를 넘겨준다. main js > ImgSlide, About 컴포넌트 => About컴포넌트에 해당 데이터를 다시 넘겨준다. > - * 카테고리 클릭시 해당 데이터가 콘텐츠로 렌더링 * > About js > Category js 와 Contents 컴포넌트 분리 : 카테고리 클릭시 콘텐츠가 변경됨 Contents에 해당하는 컴포넌트 : Tech Stack과 Workexperience, DesignSkill은 하드코딩하고 Project와 Toy Project에 카드형 컴포넌트를 만들었다. props로 받아온 데이터를 프로젝트를

2022년 11월 6일
·
0개의 댓글
·
post-thumbnail

IntelliJ + Java 불필요한 경고 비활성화 하기

경고는 오류의 전조 증상을 알려주거나 더 나은 코드를 제안해 주기도 해서 꼭 확인하려 합니다. 그런데 의도적으로 작성한 정당한 코드가 알람으로 뜨는 경우 의미있는 경고와 불필요한 경고를 구분하기가 귀찮아집니다. 점점 경고를 확인하지 않게 되고 그래서 컴파일러가 알려주는 귀중한 정보를 놓치게 될 때가 있습니다. 오늘 배운 방법을 사용해 특정 경고를 깔끔하게 끌 수 있어 유용한 것 같습니다. 앞으로 잘 사용하게 될 것 같습니다. 문제 테스트 코드를 작성하다 재활용 될 수 있는 코드가 보여서 별도의 메서드로 분리했다. 단순하게 두 개의 시간을 비교하는 메서드인데 어느 정도 차이(밀리초)가 나도 같은 시간으로 판단하는 epsilonMillis 라는 파라미터를 입력 받는다. 그런데 커밋을 하려고 하니 IntelliJ 에서 해당 코드에 경고가 있다며 검토해 보라며 커밋을 막아선다. 그냥 ‘Commit Anyway’ 할 수도 있지만 의미있는 경고일 수도 있어 확인해 본다. 경고 내용은 해

2022년 10월 12일
·
0개의 댓글
·
post-thumbnail

[Error] Uncaught ReferenceError

Error 코드를 변경하면 에러가 발생해서 바꾼 기능을 바로 테스트할 수 없었다. 새로고침 하면 페이지를 사용할 수는 있지만 바로 바로 클릭이 불가능했다. 해결 오류는 react-error-overlay 의 종속성 때문에 발생한 것이라고 합니다. 이 패키지의 종속성은 v5를 지원하도록 업데이트 되었으며, v4 webpack와 호환되지 않습니다. 방법은 두 가지가 있었는데, 첫 번째 방법은 에러가 발생해서 두 번째 방법이었던 아래의 방식을 선택했습니다. 참조 https://stackoverflow.com/questions/70368760/react-uncaught-referenceerror-process-is-not-defined https://doqtqu.tistory.co

2022년 9월 28일
·
0개의 댓글
·

[Error] You have provided an out-of-range value ‘’ for the select component.

Error select의 value가 ''인 경우를 처리해줘야 한다는 에러 해결 before 기존에는 props로 받아온 값을 바로 state값으로 넣어줬다. after state 값은 '' 로 하고, useEffect에서 setState로 값을 넣어줬다. warning이 사라졌다.

2022년 9월 28일
·
0개의 댓글
·
post-thumbnail

[Error] Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>.

Error div 태그는 p 태그의 자식요소로 들어갈 수 없음을 의미합니다. mui 에서는 Typography가 p 태그로 되어 있기 때문에, Typography 아래에 div가 있는지 찾아봐야 합니다. 에러 메시지를 보면 어느 부분에서 에러가 발생하는지 확인할 수 있습니다. 해결 Box 아래에 Typography로 감싼 후 children 요소를 넣도록 되어 있다. mui에서 예시 코드를 그냥 가져오다가 미처 확인하지 못한 것 같다. Typography태그를 삭제하니 warning이 사라졌다.

2022년 9월 28일
·
0개의 댓글
·