Sub you 개발기 4

1. Tailwind css ver 2.xx에서 jit mode를 사용하고 싶을 때

1. tailwind.config.js에 mode: "jit", purge에 ts와 tsx가 있는 경로를 명시

     mode: "jit",
     purge: [
       "./public/**/*.html",
       "./src/components/*.{js,jsx,ts,tsx}",
       "./src/components/**/*.{ts,tsx}",
       "./src/page/*.{ts,tsx}",
     ],

2. Window 사용 시  npm install cross-env -D (POSIX와 Window의 prompt의 환경변수 사용 방법이 달라서 install)
3. package.json에서 "start": "cross-env TAILWIND_MODE=watch craco start"로 변경

2. Firebase version 8 -> 9 이전 중.

tailwind version 2 -> 3 으로 업데이트 하기 위해 react-scripts의 version을 5로 update 했더니, firebase version 8에서 사용하는 firebase/compat 자체를 인식하지 못하고 있어서 firebase version 9로 업데이트하고 query들을 다시 작성하고 있다.

1. arrayUnion, arrayRemove

두개 다 8에서는 FieldValue.arrayUnion, FieldValue.arrayRemove 였지만 9에서는 firebase/firestore에서 그냥 import해서 사용하면 된다. (FieldValue도 마찬가지이다.)

 

3. map function을 사용 할 때 Key attribute 명시.

예를 들어 댓글에 대한 정보를 갖고 있는 Array 에 map function을 이용하여 댓글 component를 mount 한다고 할 때 key attribute를 주지 않으면 심각한 오류가 발생한다.