[React] console.log 지우기

yejiiha·2021년 10월 30일
2

프로젝트를 만들다 보면 수많은 console.log()
를 찍게 되는데 빌드를 할 때는 다 지워야 한다 ^_^

console.log를 지우려고 온갖 방법을 다 해봤다

🤔 babel로 지우기

babel-plugin-transform-remove-console 플러그인을 설치하고

https://www.npmjs.com/package/babel-plugin-transform-remove-console

.babelrc에 코드 추가

{
  "env": {
    "production": {
      "plugins": ["transform-remove-console"]
    }
  }
}

이 방법을 많이들 쓰던데 왜 인지 내 경우에는 적용이 되지 않았다. 😥

비슷한 방법을 여러번 시도했고, 드디어 삽질 끝에 찾은 해결책 !!

🥰 JavaScript 자체 기능 이용하기

패키지도 설치하고, babelrc를 추가도 해보고 이것저것 많이 시도해 봤지만 결국 성공한 건 이 방법이었다.

App.js에 코드 추가하기

// 배포 환경에서 console.log, console.warn 지우기
  if (process.env.NODE_ENV === "production") {
	console = window.console || {};
    console.log = function no_console() {};
    console.warn = function no_console() {};
    console.error = function () {};
  }

이제 build하면 깨끗해진 콘솔창을 볼 수 있다 !!

profile
Frontend Developer

2개의 댓글

comment-user-thumbnail
2023년 10월 6일

덕분에 저도 올리신 사진 같은 표정을 짓고 있네요ㅎㅎ 많은 도움이 되었어요. 감사합니다!

1개의 답글