๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
๐Ÿ’ป DEV/NextJS

[NEXT.js] 5. Link ์ปดํฌ๋„ŒํŠธ ์‚ฌ์šฉ ์ด์Šˆ ( new- link )

by Rising Oneโ˜… 2024. 6. 19.
728x90
๋ฐ˜์‘ํ˜•
SMALL

 

<Link>

  1. ์ •์˜ & ํŠน์„ฑ

 

  2. Nextjs 13 ๋ฒ„์ „ ์—…๋ฐ์ดํŠธ ํ›„ ์‚ฌ์šฉ๋ฒ•


์ƒ์„ธ

  1. ์ •์˜ & ํŠน์„ฑ

๊ธฐ์กด์˜ <Link> ํƒœ๊ทธ๋Š” ํ•˜์œ„์— <a> ํƒœ๊ทธ๋ฅผ ํฌํ•จํ•ด์„œ ์ž‘์„ฑํ•ด์•ผ ํ–ˆ์Šต๋‹ˆ๋‹ค.

๊ทธ๋Ÿฌ๋‚˜, Nextjs 13 ๋ฒ„์ „์œผ๋กœ์˜ ์—…๋ฐ์ดํŠธ ์ดํ›„ <a> ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•˜์ง€ ์•Š์•„๋„ ๋˜๋Š” ๊ฒƒ์œผ๋กœ ๋ณ€๊ฒฝ ๋์Šต๋‹ˆ๋‹ค.

 

next/link : <a> ํƒœ๊ทธ ์—†์ด ์‚ฌ์šฉ ๊ฐ€๋Šฅ

 

# ๊ธฐ์กด๋ฐฉ์‹
<Link>
  <a id="link">
    Home
  <a>
</Link> 

# --------------------------

# ๋ณ€ํ™”๋œ ๋ฐฉ์‹
<Link>
  Home
</Link>.

 


 

  2. Nextjs 13 ๋ฒ„์ „ ์—…๋ฐ์ดํŠธ ํ›„ ์‚ฌ์šฉ๋ฒ•

 

npx @next/codemod new-link .

 

- codemod ๋ฅผ ์‹คํ–‰ํ•ด new-link๋ฅผ ์„ค์น˜ํ•˜๊ณ , ์—…๋ฐ์ดํŠธ ๋œ. ๋ฒ„์ „์˜ nextjs13 Link ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•˜๊ฒŒ ๋œ๋‹ค.

 

next/link

 

728x90
๋ฐ˜์‘ํ˜•
LIST

๋Œ“๊ธ€