I was asked this on the website chat, but looking a bit closer I’m sure the problem was related to image paths.
The boilerplate Next.js comes with an example of the built-in Head module and they also have a favicon linked.
All we need to do is make sure we have our
Head module from Next imported and placed our link tag inside.
import Head from "next/head"; <Head> <title>Create Next App</title> <meta name="description" content="Generated by create next app" /> <link rel="icon" href="/favicon.ico" /> // <- HERE </Head>
You can grab a favicon icon-sized image from places like https://favicon.io/, they make it super easy to convert different types to favicon.
You can place the image in your
public folder or make a new folder called images / icons etc and place it there.
From your code you don’t need to add
public to your path as Next gives you access directly to static assets in the