JS' 공부흔적

이번에 사이드 프로젝트를 진행하면서 jest와 react-testing-library를 사용하여 테스트 코드를 작성하는 연습을 해보고 있다. 그중에서 svg 파일과 관련해서 내가 겪었던 에러들을 정리하고자 한다. 첫 번째 에러 이 에러는 jest와 관련된 것은 아니다. 그러나 Vite 기반의 React로 개발을 진행하고 있다면 알고 있어야 한다. svg와 관련한 첫 번째 에러는 vite 환경에서 svg를 사용하기 위한 설정을 하지 않아서 발생했었다. 이때는 vite-plugin-svgr이라는 라이브러리를 설치하여 해결했었다. // vite.config.js ... import svgr from "vite-plugin-svgr"; ... export default ({ mode }) => { ... ret..

얼마 전에 사이드 프로젝트 팀에 중간 합류했다. 기존에는 로컬 서버를 띄워놓고 테스트를 해왔는데, 며칠 전에 서버 개발자 분께서 서버를 배포하셔서 이제 배포된 서버에서 테스트 할 수 있게 되었다. 코드를 보니 이전에 작업하시던 프론트 개발자 분께서 CORS 에러에 대해 proxy 설정으로 대응해놓으셨다. "/back": { target: "http://localhost:8000", changeOrigin: true, rewrite: (path) => path.replace(/^\/back/, ""), }, 이제 실서버 주소를 적어야 하는데, 노출 방지를 위해 .env 파일에 환경변수를 등록해놓고 이를 불러와서 아래와 같이 쓰고자 했다. "/back": { target: import.meta.env.VIT..