Nuxt3 - 운영 환경에서 console.log 제거하기

왜 운영 환경에서 console.log를 제거해야 할까?

개발하다 보면 console.log를 여기저기 남기게 되는데,

운영 환경의 경우 민감한 데이터가 노출될 수 있고, 불필요한 연산이 매번 실행되기 때문에 제거하자!

 

 

설정 - esbuild.drop

// nuxt.config.js
export default defineNuxtConfig({
  vite: {
    esbuild: {
      drop: process.env.NODE_ENV === 'production' ? ['console', 'debugger'] : [],
    },
  },
})

 

 

 

선택적 제거 - esbuild.pure

console.error나 console.worn는 유지하고 console.log만 골라서 제거하고 싶은 경우 pure 옵션 사용

 

// nuxt.config.js
export default defineNuxtConfig({
  vite: {
    esbuild: {
      // console.log, console.debug만 제거 (error, warn은 유지)
      pure: process.env.NODE_ENV === 'production' ? ['console.log', 'console.debug'] : [],
    }
  },
})

 

 

 

참고로 런타임 시 console.log = () => {} 로 덮어쓰는 방법도 있지만,

코드 자체는 번들에 남아있어서 번들 사이즈가 줄어들지 않는다.