🙉
Next.jsのfaviconをMetadataで変更する
弊社のHPは、Next.js on Cloud Runで動いている(コスパが良いので)。
しかし、ずっとファビコンが、Next.jsのデフォルトの黒丸の中に白三角のマークのアレだった。
流石にそろそろなおしたいなと。
app/layout.tsx
以下のような感じに修正。
import type { Metadata } from 'next'
import * as React from 'react';
export const metadata: Metadata = {
title: "株式会社ヤード",
description: "テクノロジーでみんなが輝ける未来を!",
icons: [{ rel: 'icon', url: "/yard.svg" }],
};
export default function RootLayout({
children,
}: {
children: React.ReactNode
}) {
return (
<html >
<body>
{children}
</body>
</html>
)
}
yard.svgのファイルは、publicディレクトリ以下においておく。
appディレクトリ以下に、favicon.icoがある場合は、削除する
ファビコンを変えるだけで、2時間くらいかかってしまった。(精神的な負荷としては4時間くらい費やした気がする)
©︎ 2024 - Yard