개발 환경을 구성할 때 코드 스타일과 품질을 유지하기 위해 ESLint와 Prettier는 거의 필수적인 도구로 자리 잡았습니다. 하지만 이 둘을 한 프로젝트에서 제대로 설정하는 것은 다소 복잡하게 느껴질 수 있습니다. 또한, 신규 프로젝트를 생성할 때 마다 새롭게 설정을 하는 것은 귀찮게 느껴질 수 있습니다.
이 글에서는 @in-ch/setup 패키지를 활용해 ESLint와 Prettier를 가장 간단하게 설정하는 방법을 소개합니다.
@in-ch/setup은 은 다양한 환경에서 손쉽게 코드 스타일과 품질을 설정할 수 있도록 설계된 CLI 도구입니다. 이 패키지는 프로젝트의 초기 설정 과정을 단순화하고, 유지보수를 쉽게 만들어줍니다.
주요 특징
공통적인 ESLint
룰과 Prettier
설정을 포함
React
, TypeScript
, Node.js
등 다양한 환경 지원
지속적인 업데이트로 최신 트렌드 반영
통합된 설정: ESLint
와 Prettier
뿐만 아니라 husky
, commitlint
같은 추가 도구도 지원
커스터마이징 지원:edit
명령어를 통해 팀 컨벤션에 맞게 설정을 수정 가능
간편한 사용법: 명령어 하나로 복잡한 설정 과정 생략
npm install -g @in-ch/setup
또는
yarn global add @in-ch/setup
또는
pnpm install -g @in-ch/setup
설정할 프로젝트의 루트 디렉토리로 이동한 후, 다음 명령어를 실행합니다.
ics eslint
이 명령어 하나로 ESLint
설정 파일이 자동 생성되고 필요한 플러그인과 규칙이 적용됩니다.
영상에서처럼 명령어 한번에 아주 쉽게 설정이 끝났습니다.
Prettier 설정도 비슷하게 명령어 한 줄로 간단히 완료할 수 있습니다.
ics prettier
이렇게 하면 Prettier
설정 파일이 생성되고, 프로젝트 전반에 걸쳐 일관된 코드 스타일을 유지할 수 있습니다..
팀 컨밴션에 맞게 eslint
와 prettier
설정 파일을 변경하고 싶을 수 있습니다.
그럴 때는 edit
명령어를 통해 쉽게 설정을 커스텀화할 수 있습니다.
ics edit
이 명령어를 실행하면 설정 파일이 열리며, 필요한 대로 수정할 수 있습니다.
@in-ch/setup는 eslint
와 prettier
를 제외하더라도 husky
, commitlint
등 다양한 설정을 도와줍니다.
주요 추가 기능
더 다양한 기능은 공식 문서를 확인해보세요.
@in-ch/setup을 활용하면 번거로운 초기 설정 과정을 생략하고 바로 개발에 집중할 수 있습니다. 특히 팀 프로젝트에서 효율성과 생산성을 동시에 높일 수 있는 강력한 솔루션입니다.
이제 불필요한 설정 작업에 시간을 낭비하지 말고, @in-ch/setup을 활용해 개발에 집중해보세요! 😊
끝!