[Next.js] Next.js에 Prettier 적용하기

1. Prettier 설치

 

npm install --save-dev prettier

 

 

 

2. .prettierrc.js 파일 추가

module.exports = {
  semi: false,
  singleQuote: true,
  trailingComma: 'all',
}

semi: 세미콜론(;) 추가 여부, Next.JS는 기본적으로 세미콜론을 사용하지 않는다.

singleQuote: 작은 따옴표(') 사용 여부, Next.JS는 기본적으로 작은 따옴표를 사용한다.

trailingComma: 변경 사항을 최소화를 위해, 콤마(,)를 추가할 수 있으면 마지막에 콤마를 추가

 

 

 

3. 스크립트 설정 (package.json)

  "scripts": {
	…
    "format": "prettier --check --ignore-path .gitignore .",
    "format:fix": "prettier --write --ignore-path .gitignore ."
  },

 

 

 

4. npm run format

위와 같이 warning이 뜬다면 npm run format:fix 실행

 

다시 npm run format으로 확인

위와 같이 나온다면 성공!