Javascript/React9 [React] 'rafce' 에서 import React from 'react' 비활성 rafce, rfc 등을 하면 snippet으로 매우 간편하게 react 컴포넌트를 생성할 수 있다. 그런데 좀 귀찮은 점은 import React from 'react'을 항상 상단에 추가해준다는 점이다. React는 17버전부터 import React from 'react'를 상단에 쓰는 것이 의무가 아니다. 따라서 불필요한 import를 하지 않기 위해 따로 지우는 경우가 많은데 굳이 지우지 않고 설정으로 import를 하지 않게 하는 방법이 존재한다. 1. 먼저 extension 탭에서 ES7+ React/Redux/React-Native snippets을 선택 2. 톱니바퀴 눌러서 Extension Settings 클릭 3. 맨위에 Import React On Top을 체크해제 이제 자동완성 s.. 2024. 2. 7. [React] Import 순서의 중요성 오늘 Import 순서가 잘못되어서 기상천외한 에러가 생겼다. index.ts:16 Uncaught ReferenceError: Cannot access 'channelReducer' before initialization 터미널에선 아무런 에러가 안뜨는데 앱을 실행하면 에러가 나서 문제를 찾기도 참 어려웠다. 여기서 문제가 무엇인지 알겠는가? 7번째 줄 Request 가 문제였다. 문제는 Request Redux의 store보다 먼저 나온다는데 있다. 브라우저에서 뜨는 에러 내용을 보자 ChannelReducer를 초기화하기 이전에 접근 할 수 없다는 에러이다. 해결하고 나서 보니 너무 당연한 해보이지만 이 당시는 import 순서로 문제가 생길 수 있다는 생각을 하지 못했기 때문에 해결에 정말 애를 .. 2024. 1. 11. [React] VSC 태그 자동완성 Emmet 설정 html 에서 아래와 같이 Emmet -> Preferences에 Edit in settings.json 클릭 3. "emmet.includeLanguages": { "javascript": "javascriptreact" }, 이것을 아래 json 안에 추가해준다. 끝 2023. 12. 7. Babel vulnerable to arbitrary code execution when compiling specifically crafted malicious code 문제 이메일로 갑자기 깃헙에서 경고가 날라왔다. 바벨 때문에 컴파일시 악의적 코드가 실행 될 수 있다고 한다. 깃헙에 잠들어 있는 아무도 관심을 안가지는 레포지토리에 누가 관심이나 가지고 악의적 코드를 심을진 모르겠지만 일단 경고하니까 해결은 해야겠다. package-lock이랑 yarn.lock에서 생긴 이슈인걸 보니 관련된 라이브러리가 업데이트 되면서 생긴 문제인거 같다. 문제가 생긴 레포지토리의 중요성은 낮지만 해당 이슈의 위험도는 꽤나 높아보인다. babel/traverse가 이전 버전에서 보안 이슈가 있었는데 7.23.2 버전에서는 해당 이슈가 해결 되었으니 업데이트 하라는 말이다. 간단하게 npm i @babel/core로 바벨의 버전을 올리고 깃으로 다시 푸쉬하면 해결된다. 2023. 10. 21. 이전 1 2 3 다음
