Why isn't webpack retaining console.log statements?

Viewed 685

I'm doing my first tests with webpack and experimenting with code splitting, and I simply wanted to log from my index.js file. It gets compiled, but it doesn't log nothing, both in development or in production mode. Files are compiled and loaded. Very strange. I'm sure I'm doing something wrong... Could you please point me in the right direction?

// index.js
import _ from 'lodash';
import Swiper from 'swiper';
import { Fancybox, Carousel, Panzoom } from "@fancyapps/ui";

function log(){
  console.log('from index');
  console.log(Swiper);
  console.log(Fancybox, Carousel, Panzoom);
  console.log(_);
}

log();

webpack config:

const path = require('path');

module.exports = {
  //mode: 'development',
  mode: 'production',
  watch: true,
  entry: {
    index: './src/index.js',
    //page_2: './src/page-2.js'
  },

  output: {
    filename: '[name].js',
    path: path.resolve(__dirname, 'dist'),
  },

  optimization: {
    splitChunks: {
      cacheGroups: {
        visuals: {
          name: 'visuals',
          chunks: 'all',
          test: /[\\/]node_modules[\\/](swiper|@fancyapps\/ui|dom7|ssr-window)[\\/]/
        },
        lowdash: {
          name: 'lowdash',
          chunks: 'all',
          test: /[\\/]node_modules[\\/]lodash[\\/]/
        }
      },
    }
  },

  module: {
    rules: [
      {
        test: /\.m?js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
          options: { presets: ['@babel/preset-env'] }
        }
      } // babel
    ] // rules
  } // module
};
1 Answers

My guess would the as part of the optimization that webpack does, it cleans out your console.logs.

You could try adding

optimization: {
    minimize: false,
  },
};

and see if that helps. Although I'm surprised it's doing it in dev mode as well.

Related