CODEWITHSUNDEEP
reactjsnext.js
Sai Krishnadas
Sai Krishnadas

Reputation: 3419

The icon doesn't show in production nextjs

The meta link icon doesn't show in production nextjs but shows in localhost.

code:

const Home: NextPage<HomeProps> = () => {
  return (
    <div>
      <Head>
        <title>The Stobook</title>
        <meta
          name="description"
          content="The Stobook is an open library where you can read any book for free. It features a customizable auto function that suggests depending on user preferences."
        />
        <link rel="icon" href="/book.ico" />
      </Head>
      <div className={styles.index__container}>
        //SomeCode
      </div>
    </div>
  );
};

book.ico is in public folder. It works in localhost, but doesn't show after I deployed it into vercel. I also tried import the book.ico and href={icon.src} but thats causes error.

Upvotes: 0

Views: 1311

Answers (1)

Ramakay
Ramakay

Reputation: 3145

Issue could be related to two reasons

  1. If you have a basePath defined in your next.config.js then your path becomes - /basepath/book.ico

  2. NextJS vercel hosting issue - Try adding it to a images folder inside root - i.e

i.e

<link rel="icon" type="image/x-icon" href="/images/book.ico" />

Upvotes: 1

Related Questions