Next.js에서 Favicon을 넣는 방법을 기록하고자
글을 써본다.
먼저 front라는 폴더 밑에 pages가 있다.
그러면 pages와 동일한 위치에 public이라는 폴더를 만들어둔다.
그 아래에 favicon.ico 파일을 놓는다.
localhost:port/favicon.ico 를 주소창에 입력해보자.
브라우저에서 이미지가 뜬다면 정상적으로
긁어온다는 의미인 것이다.
이제 _app.js에 가서
Head를 import하고
Head태그 안에 link 태그를 넣는다.
예시는 다음과 같다.
import Head from 'next/head';
const MainPage = () => (
<Head>
<meta charSet="utf-8" />
<link rel="shortcut icon" href="/favicon.ico" />
<title>My Page</title>
</Head>
);이렇게 하면 될 것이다.
'Next.JS' 카테고리의 다른 글
| [Next.js] Next.js + TypeScript 구성하기(두번째) (0) | 2021.10.14 |
|---|---|
| [Next.js] Next.js + TypeScript 구성하기(첫번째) (0) | 2021.10.08 |
| [Next.js] Next.js 메타데이터(Metadata) (0) | 2021.09.27 |
| [Next.js] Next.js 이미지 업로드 실패(Module parse failed: Unexpected character) (0) | 2021.09.23 |
| [Next.js] Next.js의 Page간 탐색 (0) | 2021.09.22 |