Webpack-merge not accessing common configuration variables

As I understand, webpack-merge helps us break down our webpack.config file into more manageable chunks, adding configuration relevant to the environment.

While we will separate the production and development specific bits out, note that we'll still maintain a "common" configuration to keep things DRY. In order to merge these configurations together, we'll use a utility called webpack-merge. With the "common" configuration in place, we won't have to duplicate code within the environment-specific configurations.
- Webpack - production

My code in my webpack.prod.js is like so:

const merge = require('webpack-merge');
const common = require('./webpack.common.js');

module.exports = merge(common, {
  mode: 'production',
  devtool: 'source-map',
  module: {
    rules: [
      {
        test: /\.(png|svg|jpg|gif)$/,
        use: [
            'file-loader'
        ],
        exclude: [
          path.resolve(__dirname, "node_modules") //NEED TO ACCCESS PATH VARIABLE HERE
        ]
      }
  ]
}

In my webpack.common.js is the variable path in which I thought webpack.prod.js has access to. I'm assuming it doesn't as I am presented with an error:

ReferenceError: path is not defined

Question

How do I access the common configuration? Have I misunderstood the concept of webpack-merge?

webpack-merge will take two js objects and merge them using lodash mergeWith. So basically its returning a object which contains properties of both objects.

It cant provide with you path variable or any other variable. You will need to implicitely import it in your webpack.prod.js file.