Closed2

faviconを作るのがめんどくさい時に絵文字をSVG化するやつの話

outerHTMLでhooksでもいける。クライアント限定なのであまりイケてはない。雑に見分けつけたいだけならこれでも十分

export const Favicon = () => {
  const [icon, setIcon] = useState<string>("")
  return <div>
    <Head>
      <link rel="icon" href={icon} />
    </Head>
    <svg style={{ display: "none" }} xmlns="http://www.w3.org/2000/svg" ref={(ref) => {
      ref && setIcon(`data:image/svg+xml,${ref.outerHTML}`)
    }}>
      <text y="32" fontSize="32">🦤</text>
    </svg>
  </div>
}

あと、逆に「動的に絵文字変えたい」みたいなときはわりと使える手段になりそう

このスクラップは2021/05/08にクローズされました
ログインするとコメントできます