Frontend/Error

오류 발생 VSCode에서 Typecript + React 환경으로 개발을 하던 중 에디터에 React 컴포넌트에 붉은줄이 마구 생기면서 아래와 같은 오류가 발생했다. 딱히 건드린 코드가 없는데 갑자기 발생한 오류라 당황스러웠다. 오류 상세 'React' refers to a UMD global, but the current file is a module. Consider adding an import instead. 원인 분석 React 16에서 React 17로 넘어가면서 JSX Transformation 방식이 변했는데 이로 인해 발생하는 문제라고 한다. React 17에서 Transformation과 관련해 변경된 부분은 2가지이다. 첫 번째는 기존에는 React 컴포넌트 코드에 i..

오류 발생 Typescript와 Jest로 작성한 테스트코드를 실행했더니 Jest encountered an unexpected token 라는 오류가 발생했다. 오류 상세 npm test > test > jest FAIL app/components/example/Button.test.tsx ● Test suite failed to run Jest encountered an unexpected token Jest failed to parse a file. This happens e.g. when your code or its dependencies use non-standard JavaScript syntax, or when Jest is not configured to support such synta..

오류 발생 VSCode로 React + Typescript환경에서 테스트코드를 작성하는 과정에서 toHaveClass가 없다는 오류가 발생했다. 오류 상세 import Button from "./Button"; import { render, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; test("when the Button is clicked, then background color changes red to blue", async () => { const user = userEvent.setup(); render(); const button = screen.getByRole("but..

오류 발생 npx create-remix@1 Remix 프로젝트를 생성하고 실행하려는데 오류가 발생했다. 생성 시 선택한 옵션은 아래와 같다. 서버로 Remix App Server를 언어는 JavaScript를 선택했다. iksflow@Sungs-MacBook-Pro  ~/studyroom  npx create-remix@1 ? Where would you like to create your app? remix-app ? What type of app do you want to create? Just the basics ? Where do you want to deploy? Choose Remix App Server if you're unsure; it's easy to change deploymen..