🙄

Viteのbuild時にconsole.logを消す時のメモ

2022/12/12に公開

viteのconsole.logの消し方

結論

vite.config.ts
export default defineConfig({
    esbuild: {
      drop: ['console', 'debugger'],
    },
});

esbuildはバンドルツールであり、viteはこれに依存している。
esbuildにconsoleを消すオプションがあり、viteからesbuildのオプションを使うことでlog消しを実現しているっぽい。
esbuildのオプション
viteのesbuildのオプション

余談(production時のみconsole消す)

こう書けばいいかな。

vite.config.ts
import { defineConfig, loadEnv } from 'vite'

export default defineConfig(({ mode }) => {
	const envPrefix = ['VITE_', 'APP_ENV']
	const env = loadEnv(mode, '.', envPrefix)
	return {
	...
		esbuild: {
			drop: env['APP_ENV'] === 'production' ? ['console', 'debugger'] : [],
		},
	}
})

まとめ

調べてたら情報が錯綜してどれが正しいのかうまくわからなかったのでメモとして。
記事を書き始めてから見つけたのですが、、
この記事のDiscussionの内容が全てだなって感じですね

Discussion