반응형 frontend/React7 [React] Vite로 React 프로젝트 세팅하기 강의를 듣고 세팅하는 방법을 기록해두는 포스팅.. Vite는 프론트엔드 개발을 더 용이하게 해주는 일종의 개발 툴이라고 할 수 있다. vite는 go로 작성된 esbuilder를 사용하기 때문에 매우 빠른 빌드 속도를 자랑한다. 먼저 새로운 vite 프로젝트를 생성해보자 npm create vite@latest 터미널을 열고 위 명령어를 실행한다. 프로젝트 이름을 정하고 프레임워크를 선택하라고 나오는데 나는 React를 선택할 거니까 React를 골라준다. 그 다음엔 자바스크립트를 사용할지 타입스크립트를 사용할지 고르라는 선택지가 나오는데 난 Rust typescript 컴파일러인 SWC가 포함된 두번째 옵션을 선택했다. 그럼 프로젝트가 생성이 되었다. 위 설명대로 프로젝트 경로로 이동해서 패키지들을 설.. 2023. 11. 17. [React]React + TypeScript 시작하기 https://bk0625.tistory.com/2 [React]리액트란? 리액트란 페이스북에서 개발한 유저 인터페이스 라이브러리이다. 개발자로 하여금 재사용 가능한 UI를 생성할 수 있게 해주는데 페이스북, 인스타,넷플릭스 등 많은 큰 서비스에서 사용하고 있 bk0625.tistory.com https://bk0625.tistory.com/18 [TypeScript] 타입스크립트란? 타입스크립트란? 타입스크립트는 마이크로소프트에서 구현한 JavaScript의 슈퍼셋 프로그래밍 언어로 정적 타입을 명시 할 수 있다는게 순수 자바스크립트랑 가장 큰 차이점이다. 따라서 개발자 bk0625.tistory.com 리액트는 페이스북에서 개발한 유저 인터페이스 라이브러리이다. 개발자로 하여금 재사용 가능한 UI를 .. 2023. 4. 25. [React]TS/JS 버전 에러 Type 'string' can only be iterated through when using the '--downlevelIteration' flag or with a '--target' of 'es2015' or higher. 사이드 프로젝트를 개발하다가 string to array를 하기 위해 spread를 사용하였다. 그런데 에러 발생! 왜 에러가 났는고 하니 바로 사용하는 자바스크립트 버전이 낮아서 생긴 문제이다. 이는 tsconfig 파일로 가서 컴파일옵션에 target을 변경해주면 된다. 기존에는 target이 es5로 되어있다. es2015나 그보다 높은 버전을 사용해야하니 ES2016으로 변경하니 잘 동작한다! 공부하면서 정리한 내용입니다. 모든 지적 감사히 받겠습니다:) 2023. 4. 5. [React]Parsing error: 'import' and 'export' may only appear at the top level. 새로 이직한 회사에서 프론트 관련 업무를 하던 도중 해당 에러가 발견했다. `}`를 빼먹었을거라고 생각하고 제일 밑에 export 하기 전 }를 쳤더니 에러가 터져난다. 즉 }의 위치가 거기가 아니라는 거. 구글링을 해보니 '}'을 빼먹어 그 밑에서 부터 모두 내부 함수가 되어버리고 최하단까지 도달해서 export default 키워드가 등장했는데 닫침 괄호가 없어서 해당 코드가 함수 내부에 위치하게 되었고 최상단 함수에서 import나 export 실행하라고 해당 에러를 뱉어냈다는거... 참고 링크 https://velog.io/@hwang-eunji/Syntax-error-import-and-export-may-only-appear-at-the-top-level Syntax error: 'import.. 2023. 3. 28. 이전 1 2 다음 반응형
