FaviconsWebpackPlugin won't generate icons, inject them into head #3068

schoenwaldnils · 2017-10-10T17:40:10Z

I have searched the issues of this repository and believe that this is not a duplicate.

my config (tidied)

// next.config.js
import HtmlWebpackPlugin from 'html-webpack-plugin';
import FaviconsWebpackPlugin from 'favicons-webpack-plugin';

module.exports = {
  webpack: (config, { dev }) => {
    config.plugins.push(
      new FaviconsWebpackPlugin({
        logo: './static/assets/images/favicon.png',
        inject: true,
      }),
      new HtmlWebpackPlugin(),
    );

    return config;
  },
};

// pages/_document.js
import React from 'react';
import Document, { Head, Main, NextScript } from 'next/document';

export default class SmediaDocument extends Document {
  render() {
    return (
      <html lang="en">
        <Head>
          <meta charSet="utf-8" />
          <meta content="IE=edge" httpEquiv="X-UA-Compatible" />
          <meta content="width=device-width,initial-scale=1" name="viewport" />
          <title>Schoenwald.media</title>
          <meta name="description" content="Thoughts on CSS, JS, and overall clean code." />
        </Head>
        <body>
          <Main />
          <NextScript />
        </body>
      </html>
    );
  }
}

I'd expect that the favicons-webpack-plugin generates the icons, and the html-webpack-plugin inject it in the <head/> of the page. Which it doesn't.

Steps to Reproduce

Checkout https://github.com/schoenwaldnils/blog
Set up .envfile with

HOST=localhost
PORT=3000

docker-compose up

Environment

Tech	Version
next	~4.0.0-beta.4
html-webpack-plugin	~2.30.1
favicons-webpack-plugin	0.0.7
node	8.4.0
OS	mhart/alpine-node:8.4.0

The text was updated successfully, but these errors were encountered:

MacKentoch · 2017-11-21T16:32:04Z

Does it run production?
In dev (npm run dev) webpack won't run your plugins (see .next directory content).

My issue is to found out a way to make sw-precache-webpack-plugin working even in dev (only works in production).

mtford90 · 2018-03-09T12:08:39Z

Hmmm I'm facing similar issues with next 5 despite universal webpack. Similar setup to above:

	return Object.assign({}, nextConfig, {
		webpack(config, options) {
			config.plugins.push(
				new FaviconsWebpackPlugin({
					logo: './static/img/favicon.png',
					inject: true
				})
			)

			config.plugins.push(
				new HtmlWebpackPlugin()
			)
                }
        }

I see nothing injected when running in both prod & dev

Am I perhaps missing something important? @timneutkens :P

I do have a custom _document.js... perhaps I need to modify that in some way to inject the necessary tags within <head/> - I can't see anything in the context/pageContext however assuming that's the correct place

timneutkens · 2018-03-09T14:05:34Z

new HtmlWebpackPlugin() this does nothing in Next. Next uses React, not html, as a renderer.

The favicons will probably end up somewhere in the .next folder.

timneutkens mentioned this issue Jan 16, 2018

Universal Webpack #3578

Merged

timneutkens closed this as completed Jan 31, 2018

lock bot locked as resolved and limited conversation to collaborators May 16, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

FaviconsWebpackPlugin won't generate icons, inject them into head #3068

FaviconsWebpackPlugin won't generate icons, inject them into head #3068

schoenwaldnils commented Oct 10, 2017 •

edited

Loading

MacKentoch commented Nov 21, 2017

mtford90 commented Mar 9, 2018 •

edited

Loading

timneutkens commented Mar 9, 2018

FaviconsWebpackPlugin won't generate icons, inject them into head #3068

FaviconsWebpackPlugin won't generate icons, inject them into head #3068

Comments

schoenwaldnils commented Oct 10, 2017 • edited Loading

my config (tidied)

Steps to Reproduce

Environment

MacKentoch commented Nov 21, 2017

mtford90 commented Mar 9, 2018 • edited Loading

timneutkens commented Mar 9, 2018

schoenwaldnils commented Oct 10, 2017 •

edited

Loading

mtford90 commented Mar 9, 2018 •

edited

Loading