• Introduction
• Development
• Changing the Port
• Configuring SSL
• Configuring Basename
• Building
• Development
• Production
• Analyzing
• Stats
• Features
• Cache Busting
• Chunking
• CSS Preprocessors
• Favicon
• Fonts
• Images
• Source Maps
• Misc
• Verify Production Build Locally

Favicon

Webpack is configured to use the favicons-webpack-plugin in order to generate a set of favicons from the image located at assets/images/favicon.png. The default image is a 1500px png of the Lore logo.

If you're new to favicons, a useful resource to learn more is https://realfavicongenerator.net.

The plugin will use the favicon.png file to generate a number of smaller favicons for different devices. By default, favicons will only be generated for the browser, but you can modify the config if you need to generate favicons for devices like Apple, Android and Windows.

Relevant Section

This section of the Webpack config that controls this behavior is shown below:

var FaviconsWebpackPlugin = require('favicons-webpack-plugin');
...
new FaviconsWebpackPlugin({
  logo: './assets/images/favicon.png',
  prefix: 'favicons-[hash]/',
  emitStats: true,
  statsFilename: 'favicon-manifest.json',
  icons: {
    android: false,
    appleIcon: false,
    appleStartup: false,
    coast: false,
    favicons: true,
    firefox: false,
    windows: false,
    yandex: false
  }
})