In webpack what is the difference between path and publicPath

Question

I have my webpack config file shown below that bundles main.js from ./src/ into ./lib/public

What exactly is the publicPath doing? I can see that only the path specifies the folder the js bundle will go into?

module.exports = {
  entry: './src/js/main.js',
  output: {
    filename: 'bundle.js',
    path: './lib/public/',
    publicPath: 'public'
  },
  module: {
    loaders: [
      { test: /\.js$/, loader: 'babel-loader' }
    ]
  }
};

Answer 1

You can use is to define the location of your assets (images etc.). I.e. you can load assets from a custom directory or a CDN even by setting it. See output.publicPath at the official documentation for further information.