React - develop모드 일때에만 콘솔찍기

React - develop 모드일 때에만 콘솔이 보이도록 하기

react로 개발을 하고 build를 한 후에 실제 서비스를 할 수 있게 서버에 올리는데, 웹 페이지는 크롬 개발자 도구를 사용하면 콘솔창에 로그가 보인다.
따라서, development 모드일 때에는 개발자 도구 콘솔 창에 로그가 보이고, production 모드일 때에는 콘솔 로그가 보이지 않도록 하면 좋을 것이다.
package.json에 아래와 같이 수정한다.

"scripts": {
  "start": "REACT_APP_ENV=development NODE_PATH=./src react-scripts start",
  "build": "REACT_APP_ENV=production NODE_PATH=./src react-scripts build",
}

yarn start을 하게 되면 development 모드로 실행되고, yarn build를 하게 되면 production 모드로 실행된다. 제일 먼저 진입하는 파일에서 console.log('env: ', process.env.REACT_APP_ENV)를 찍어보면 REACT_APP_ENV안에 development인지 production인지 찍힐 것이다.
그러면, 아래와 같이 콘솔 로그를 production 모드일 때에만 아무 것도 하지 않는 함수로 덮어씌워주면 개발자 도구 콘솔 창에 로그가 보이지 않는다.
React의 경우, index.js에 추가했다.(config.js 파일로 빼도 상관은 없다.)

if (process.env.REACT_APP_ENV !== 'development') {
  console.log = () => {}
}