Show GN: Node.js 환경에서 Clang을 이용한 C, C++, Java 포매터를 개발하였습니다.

안녕하세요, Node.js 환경에서 Clang을 이용한 C, C++, Java 포매터를 개발하였습니다. 해당 프로젝트는 이미 더 이상 유지 보수되지 않는(deprecated된) angular의 clang-format 패키지를 기반으로 새롭게 진행하는 프로젝트 입니다.

한 두달 전쯤에도 한번 같은 내용을 올렸었는데, 패키지의 안정성이 더욱 높아지고 새로운 기능들이 추가되어 다시 글을 작성하게 되었습니다.

현재 많은 분들이 관심 가져주시고, 기존 레거시 유저분들이 많이 넘어와주신 덕에 주간 다운로드 수 10,000회를 돌파하였습니다. 정말 감사드립니다.

또한, 해당 패키지는 풀 테스트 커버리지를 달성하였고, Node.js 코어에서 기존 angular의 clang-format 프로젝트 대신 현재 패키지를 이용하는 방식으로 변경하려는 PR이 올라와 있는 만큼, 안정성은 믿고 사용하셔도 될 것 같습니다. (물론, 아직 제가 놓치고 있는 부분들이 있을수도 있습니다...ㅠ)

해당 패키지는 LLVM의 C 컴파일러로 유명한 Clang의 clang-format을 기반으로 C, C++, Java 언어의 코드 포맷팅을 잡아주는 패키지 입니다. Node.js 환경에서 가장 유명한 패키지 중 하나인 Prettier와 동일한 역할을 한다고 보면 될 것 같습니다.

다만, Prettier 패키지에서는 C, C++, Java 언어의 포맷팅을 지원하지 않기에, 해당 언어에서 포맷팅을 잡기 위해서는 clang-format을 이용하는 경우가 많습니다.

Node.js 환경에서의 clang-format은, Node.js 코어 개발과 같이 자바스크립트 코드와 C/C++ 코드를 함께 작성해야 할 때 특히 유용합니다. 기존 clang-format의 경우, 해당 패키지를 이용하기 위한 추가 의존성들을 설치해야 했지만, 현재 패키지를 이용하면 그럴 필요가 없습니다.

또한, 기존의 clang-format 패키지는 CI 등에서 Node.js와 npm을 이용한 워크플로에 통합하기 꽤나 까다로운 면이 있었지만, 현재 패키지를 이용하면 단순히 npm에서 다운로드만 받고 스크립트 설정만 해주면 되기에, CI 환경에서의 많은 이점이 있습니다.

추가로, 1.2.0 버전으로 업그레이드 되면서 새로운 기능들이 추가되었습니다. 핵심 변화는 git-clang-format 패키지를 추가했다는 점입니다.

C/C++ 프로젝트를 진행하다 코드 포맷팅의 필요성을 느껴, clang-format 등의 패키지를 도입하려는 상황을 예로 들어보겠습니다.

작은 규모의 프로젝트에서는 코드 포맷팅을 일괄적으로 뜯어 고친 뒤 일괄적으로 커밋을 해도 히스토리 추적에 별 문제가 없을 수 있습니다. 다만, 큰 규모의 프로젝트에서는 코드 포맷팅의 도입으로 인하여, 기존 코드의 포맷팅을 일괄적으로 뜯어 고쳐야만 하기에 커밋 히스토리 추적이 지저분해질 위험이 있습니다.

이때 만약, 개발자가 1000줄의 코드 중 100줄의 코드만 수정하였고, 커밋 시 수정된 100줄의 코드만 포맷팅 검사를 한다면 어떻게 될까요? 첫째로, 수정된 100줄의 코드만 포맷팅을 적용하면 되니, 1000줄의 코드를 모두 뜯어 고칠 필요가 없어져 커밋 히스토리 추적이 편리해질 것입니다. 둘째로, 개발 과정 중에 계속해서 코드가 커밋될 때마다 점점 포맷팅이 적용된 코드가 많아지게 되니 시간이 지날수록 코드 포맷팅은 일관성을 갖추게 될 것입니다.

이를 위해 사용하는 것이 git-clang-format 패키지입니다. lint-staged를 통해 staged된 파일만 검사하여 CI 속도를 향상시키듯, 이보다 한단계 더 나아가서 변경된 파일 중 변경된 코드에 해당하는 라인만 검사하여 코드 포맷팅 검사를 적용할 수 있습니다. 이 역시 LLVM에서 기본으로 제공되고 있기에, 패키지로 래핑하여 발행하였습니다.

공식문서에 정확한 사용법을 기술해 두었으니 많은 관심 부탁드립니다.(다만 공식문서는 영어입니다ㅠ) 궁금하신 점이나 다른 의견 있으시면 남겨주시면 감사하겠습니다. 긴 글 읽어주셔서 감사드립니다.

공식 문서: https://clang-format-node.lumir.page
레포지토리: https://github.com/lumirlumir/npm-clang-format-node