user icon

Nuxt.jsのbuild時にconsole.logを削除する

小ネタ集を書いていて分けておいたほうがよさそうだと思ったヤツ、その2。

nuxt buildでproductionビルドするときにconsole.logが削除されると良くないです?
良いですよね?なのでminifyを行うモジュールにはそういう機能が載っているようです。

Nuxt.jsのproduction時にconsole.logを削除する – くらげになりたい。

との情報を見つけました。ありがたい!

ですが、デフォルトのterser-webpack-pluginではなくuglifyjs-webpack-pluginに差し替えて実現されているとのこと。
この情報をもとに調査・実験をすすめたところterserのままでも可能でしたのでnuxt.config.jsのbuildの該当箇所を提示します(“nuxt”: “^2.4.0”)

module.exports = {
  // 略
  build: {
    // 略
    terser: {
      terserOptions: {
        compress: {
          drop_console:
            process.env.NODE_ENV === 'production' ||
            process.env.NODE_ENV === 'training'
        }
      }
    }
  }
}

この設定では本番のproduction、顧客練習用に追加したtrainingのbuildの際にはconsole.xを削除されます。
その他(例えば私の場合はローカル開発用のdevelopmentや動作確認デプロイ用に追加したstaging)では削除されず、コンソールにメッセージが出力されます。

※ production、training、stagingなどについては「Nuxt.js 悩み解決の小ネタ集」のcross-envの項目をご参照ください。

Facebooktwitterlinkedintumblrmail

Tags: ,

Trackback

Comment

  • 1.
  • そばちゃん
  • 2020/09/09 15:17

この記事、参考になりました!
ありがとうございます!

名前
E-mail
URL
コメント

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)