How to use webpack

How to create the simplest config for Webpack

// webpack.config.js
const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js',
  },
};
<!-- page.html -->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    ...
  </head>
  <body>
    ...
    <script src="dist/bundle.js"></script>
  </body>
</html>
// src/index.js
import bar from './bar.js';
bar();
// src/bar.js
export default function bar() {
  //
}

Webpack follows the javascript dependency tree starting from the entry file in the config and puts the final bundle file in the output path with the given file name.