LoginSignup
0
0

More than 1 year has passed since last update.

Next.jsのファビコンを非表示にする

Last updated at Posted at 2022-02-13

メモです。
プロジェクトで、このデフォルトファビコンを削除、変更したいなぁって時にふりかえります。

ファビコンとは?

これ
image.png

Next.jsのアプリケーションを作成するとこんなのがデフォルトで表示されているはず
image.png

削除するには?

以下のパスにある、ファイルの <link rel="shortcut icon" type="images/x-icon" href="/favicon.ico" /> href部分を変更すればOK。
他のファビコンを表示したい場合は、<project_name>/public/favicon.icoの画像ファイルを変更すればOK.

/pages/_document.tsx
import Document, { Html, Head, Main, NextScript } from 'next/document';

export default class MyDocument extends Document {
  render() {
    return (
      <Html>
        <Head>
          <meta charSet="utf-8" />
          <link rel="shortcut icon" type="images/x-icon" href="/favicon.ico" />
        </Head>
        <body>
          <Main />
          <NextScript />
        </body>
      </Html>
    );
  }
}

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0