react6 [React] Create react app 프로젝트에 절대경로 import 설정하기 결론{ "compilerOptions": { "baseUrl": "src" }, "include": ["src"]} tsconfig.json 을 위와 같이 설정하기.최신버전 CRA 는 tsconfig.json 의 일부 설정을 자동으로 인식하고 적용함.특히 baseUrl 과 paths 설정은 추가설정 없이도 작동할 수 있음. CRA 는 웹팩과 바벨 설정을 숨기고 관리하기때문에 일반적으로 설정을 직접 수정하려면 eject 를 하거나 추가 도구를 사용해야한다. 그래서 검색해봤을때 다른 사람들은 craco 같은 도구를 사용해서 CRA 설정을 오버라이드 하는 것 같던데 .. 나는 tsconfig.json 을 위와같이 설정해줬는데 절대경로가 설정됐다. 내 CRA 버전은 5,0.1 이다. CRA 버전 확.. 2024. 7. 28. [react-query]Error: No QueryClient set, use QueryClientProvider to set one app.jsx 에서 queryClient 를 만들어주고 queryClientProvider 로 app에서 리턴하는 것 전체를 감싸주면 되는데 이렇게 해줘야되는걸 이렇게 오타내서 에러가 났다 ^_T import "./App.css"; import { InfinitePeople } from "./people/InfinitePeople"; import { InfiniteSpecies } from "./species/InfiniteSpecies"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; const .. 2023. 8. 26. [ TIL ] react-hook-form import {useForm} from "react-hook-form" register 함수를 사용하면 onChange 를 핸들러 할 필요가 없다. import {useForm} from "react-hook-form" const {register} = useForm(); onBlur 다른 곳 클릭하는 것 .......... register 는 객체 여기에 name, onBlur, onChange, ref 등 ...이 있다. const {register, watch} = useForm(); watch가 나의 form 에 대한 모든 내용을 감시한다. watch() 해 보면 값이 변할 때 마다 값을 출력해주고있음 우리가 이렇게 적은 "toDo" value 를 key 로 갖고있다. function ToDoLi.. 2023. 4. 3. Recoil 사용 연습하기 - 2 atom 의 value를 감지하기 위해서 useRecoilValue const isDark = useRecoilValue(isDarkAtom); useRecoilValue 가 atom 을 넣으면 atom 값을 반환한다. atom 의 value set하기 위해 useSetRecoilState(Atom) 이렇게 하면 setter function 받을 수있음 const setterFn = useSetRecoilState(isDarkAtom); atom 을 받아서 atom 을 변경하는 함수를 반환 setState 처럼 사용하면 된다. const toggleDarkAtom = () => setDarkAtom((prev) => !prev); atom 이 변경되면 컴포넌트도 변경된 값으로 다시 리렌더링 된다. 2023. 4. 3. 이전 1 2 다음