배포 전 디버그용 console.log 제거 누락을 방지하는 ESLint 규칙 적용(no-console, no-restricted-syntax)

Jake·2025년 6월 29일

팀으로 프로젝트를 진행하게 되면 코드 리뷰 중 반복적으로 발생하는 리뷰 내용들이 존재합니다.

그중 코딩 컨벤션에 대한 리뷰는 리뷰어에게 불필요한 에너지와 시간을 소모하게 하고, 이는 충분히 시스템 적으로 개선이 가능한 부분입니다.

진행 중인 프로젝트에는 개발 중 디버그를 위해 작성하는 console 코드들을 PR 작성 전 직접 찾아서 제거해야 하는 반복 작업이 존재했는데, 이를 lint를 활용해 개선한 과정을 공유하고자 합니다.

해당 내용은 ESLint, huskylint-staged를 사용했으며 관련 내용은 공식 문서를 참고 바랍니다.

해결 방법 - no-console 규칙 사용

eslint를 사용 중 일 경우 아래처럼 eslint 설정을 통해 no-console 규칙을 적용할 수 있습니다.

{
    "rules": {
        "no-console": ["error"]
    }
}

규칙을 적용하고 console을 사용할 경우 아래 이미지처럼 에러를 확인할 수 있습니다.
이를 husky, lint-staged와 같이 사용해 커밋 전 제거를 강제할 수도 있습니다.

no-console 규칙을 적용한 것만으로도 충분히 개선이 이뤄진 것 같습니다.

새로운 문제점

기존 프로젝트에는 Server 환경에서 console을 사용해 로그는 남기고 있었기 때문에 console.log 사용이 필요한 곳까지 에러가 발생하게 됩니다.

이를 해결하기 위해 아래의 해결 방법이 존재합니다.

  1. 주석을 이용해 해당 라인만 eslint 비활성화
    // eslint-disable-next-line no-console

    ⇒ 가장 단순하지만 사용할 때마다 매번 주석을 작성해야 함

  2. console을 다른 이름으로 선언해 사용

    ⇒ 로그가 필요할 경우 Log.log, Log.info 같은 인터페이스로 사용

Console 객체를 Log로 선언해서 사용

console을 Log로 선언해 기존 console 사용을 막고, 운영 환경에서 로그가 필요할 경우 Log를 사용하도록 했습니다.

/**
 * 실 서비스 환경에서 콘솔에 로그를 출력합니다.
 *
 * `console`의 직접 사용은 허용하지 않습니다.
 *
 * @example
 * ```ts
 * Log.info('info')
 * Log.debug('debug')
 * Log.warn('warn')
 * Log.error('error')
 * ```
 */
export const Log = console

추가로 console을 그대로 사용할 경우 에러와 함께 Log 사용을 안내하는 메시지를 제공하기 위해 no-console 규칙에서 no-restricted-syntax 규칙으로 변경했습니다.

{
    "rules": {
        "no-console": ["off"],
        "no-restricted-syntax": [
            "error",
            {
                "selector":
                    "CallExpression[callee.object.name='console'][callee.property.name=/^(log|warn|error|info|trace|debug)$/]",
                "message":
                    "프로덕션 환경에서 로그 출력이 필요할 경우 Log 클래스를 사용하세요 `common/utils/log.ts`"
            }
        ]
    }
}

적용 후 console 객체를 직접 사용할 경우 아래처럼 에러 메시지를 확인할 수 있습니다.

필요할 경우 Log를 사용

결론

반복적으로 발생하는 이슈의 경우 그 빈도와 중요도가 높지 않더라도 개선 여지가 존재함

⇒ 시스템적으로 개선 필요

간단한 규칙들은 eslint 규칙을 활용해서 개선 가능

⇒ 코딩 컨벤션을 정할 때 관련된 lint 규칙도 함께 적용하면 도움이 됨

0개의 댓글