:art: Update: prettier format적용

[EunKangChoi-Dyphi]

⛳️ 기능 구현 배경

---

같은 프로젝트의 코드를 다른 포맷팅에 적용되어 PR 요청시 코드 충돌이 일어납니다. 코드포맷팅을 통일화를 시켜서 이러한 코드포맷으로 인한 코드 충돌을 해결하고자 합니다.

🧐 기능 구현 내용(Optional)

---

맞춰야할 주제

• [x] feature/issue-32 를 체크아웃했을때 제 컴퓨터화면에서 화면과 동성님 화면에서 prettier/eslinter 로 인해서 오류밑줄이 발생하는지 체크해볼것.

• [x] 앞으로 나머지 기간동안 주단위 업무공유 및 보고를 할건지 => github issue / PR 로 보고 / 주 최소 1개(주0개일경우, 1주일에 너무 프로젝트기간이 얼마안남아서 못했다... 사유미리공유해주시면될거같아요/ 압박X / 개인의 양심!) 4/30안에 기능구현하기! => 백오피스 래포... => 깃헙그룹만들어서

• [x] 슬랙폭파전에 프로젝트관련 필수정보 들을 (예: 배포할때 도커실행방법) 갖고오기 -> 동성님꺼는 찾아보시고 수집후 더이상 수집할게없으면 PR머지하시면됩니다.

• [x] 환경변수값 세팅은 제가 노션문서에 관리하고있습니다!

• 운영서버관련 시크릿값과 폭파전에 필요한 내용(도커런/운영배포방법) 이렇게만 정리했구 이 링크는 현재 저만 볼수있도록 private되어있습니당 ㅠ! 동성님께는 pdf로 드릴게요! https://www.notion.so/ek12mv2/Trazzle-7eea98986eee422785c17fa55d927788?pvs=4

.prettierrc 파일

• semi: true: semi(홑따옴표, ') 를 true 로하게되면 쌍따옴표와 홑따옴표 두개다 사용가능해요!
• endOfLine: auto: OS가 서로다를 수있으므로 OS맞춰서 endOfLine을 설정했습니다! ( macOS: LF / windows: CRSF )
• printWidth: 80 : 한줄에 80자가 넘어가면 자동으로 개행을 해줍니다. prettier 권장사항이에요!
• arrowParens : "avoid" : 에로우함수() => {} 형태인데 항상 () 를 감싸지 않도록 한거에요! 이와 정반대는 arrowParens: "always" 입니다!

{
  "singleQuote": false,
  "trailingComma": "all",
  "endOfLine": "auto",
  "semi": true,
  "printWidth": 80,
  "arrowParens": "avoid"
}

eslintrc.js

• semi, quotes 에서 오류가 발생한거 같아영,, 맨아래 두개때문에 quote 오류 관련 빨간밑줄이 떠서 주석처리햇습니다! 빨간밑줄의 이유는 엄격하게 지키게끔되어있는거같아여!

module.exports = {
  parser: "@typescript-eslint/parser",
  parserOptions: {
    project: "tsconfig.json",
    tsconfigRootDir: __dirname,
    sourceType: "module",
  },
  plugins: ["@typescript-eslint/eslint-plugin"],
  extends: ["plugin:@typescript-eslint/recommended", "plugin:prettier/recommended"],
  root: true,
  env: {
    node: true,
    jest: true,
  },
  ignorePatterns: [".eslintrc.js"],
  rules: {
    "@typescript-eslint/interface-name-prefix": "off",
    "@typescript-eslint/explicit-function-return-type": "off",
    "@typescript-eslint/explicit-module-boundary-types": "off",
    "@typescript-eslint/no-explicit-any": "off",
    "@typescript-eslint/ban-ts-comment": "off",
    // semi: ["error", "always"], // 세미콜론을 항상 사용하도록 설정
    // quotes: ["error", "single"], // 싱글 쿼트를 사용하도록 설정
  },
};

package.json 내 prettier 포맷팅 자동적용 명령어

$ npm run format

📭 이슈 번호

---

32

🖐️ 의견 구하기

---

위에 저희가 오늘 10시에 디코온라인회의에 만나서 해야할 주제들을 정리해봤습니다!

[loveAlakazam]

@lullaaaby13 내일 확인하고 머지눌러주세용~ 슬랙 폭파전에 가져가야할 슬랙메시지기록같은거 입니다.

[lullaaaby13]

어제 중요한 정보는 백업해주셨고 저도 딱히 없는 것 같아서 바로 머지하겠습니다 😃