NuxtLink 개요는 Vue Router의 와 html의 태그를 모두 대체하는 Nuxt3의 내장 컴포넌트이다.내부 링크와 외부 링크를 자동으로 구분하고, 최적화를 사용하여 링크를 렌더링 한다.NuxtLink는 내부 링크인지 외부 링크인지 자동으로 감지하고 적절한 방식으로 처리합니다.내부 링크 (/main 같은 경로)는 Vue Router를 사용해 클라이언트 사이드 내비게이션을 수행합니다.외부 링크 (https://example.com)는 일반적인 태그로 렌더링 됩니다.내부 라우팅이렇게 내부 경로의 /main으로 설정되어 있는 경우, 내부의 다른 페이지에 연결한다. Main Page 외부 라우팅이렇게 외부 경로 url이 설정되어있는 경우, 외부 웹사이트에 연결한다. Nuxt Doc..
definePageMeta()pages/ 디렉터리에 있는 페이지 컴포넌트에 대한 메타데이터를 설정하는 데 사용할 수 있는 컴파일러 매크로 함수이다. 주요 요소들은 아래와 같다.definePageMeta로 정의한 메타데이터의 주요 요소 • alias여러 URL을 동일한 페이지로 연결할 수 있도록 별칭을 지정합니다. • keepalive페이지를 로 감싸 상태를 유지하도록 설정합니다. • key의 렌더링을 제어하기 위한 키 값을 설정합니다. • layout페이지에 사용할 레이아웃을 지정합니다. false로 설정하면 레이아웃을 비활성화할 수 있습니다. • layoutTransition / pageTransition페이지 및 레이아웃 변경 시 사용할 전환 효과를 설정합니다. • middleware페이지를 로드하기..
Nuxt 3 공식 문서https://nuxt.com/docs/getting-started/installation Installation · Get Started with NuxtGet started with Nuxt quickly with our online starters or start locally with your terminal.nuxt.com0. node version# node versionnvm install 20nvm use 20npm -v1. create nuxt빈 폴더 하나를 만들고, 터미널에서 pnpm으로 설치했다.npx nuxi@latest init nuxt3_lecture 2. package manager 선택npm 선택 3. package.json 수정 (nuxi)nuxt3부터..
