サイトアイコン Opvelのブログ

Next.jsでビルド時にconsole.log等を削除する

terser-webpack-pluginを使う方法。動いてるっぽい

installする

npm install terser-webpack-plugin --save-dev

next.config.jsに追記する

const TerserPlugin = require("terser-webpack-plugin");
const isProd = process.env.NODE_ENV === "production";

module.exports = {
  reactStrictMode: true,
  webpack: (config, options) => {
    config.optimization.minimize = isProd;
    config.optimization.minimizer = [
      new TerserPlugin({
        terserOptions: {
          compress: {
            drop_console: isProd,
          },
        },
        extractComments: "all",
      }),
    ];
    return config;
  },
};

drop_console 参考 https://github.com/mishoo/UglifyJS#compress-options

extractComments 参考 https://github.com/webpack-contrib/terser-webpack-plugin#extractcomments

モバイルバージョンを終了