Nuxt는 웹 애플리케이션 내에서 경로를 생성하기 위한 파일 기반 라우팅을 제공한다. 애플리케이션의 번들 크기를 줄이기 위해 이 디렉터리는 선택 사항이다. 즉, app.vue만 사용하는 경우 vue-router가 포함되지 않는다. 페이지 시스템을 강제하려면 nuxt.config에서 페이지를 true로 설정하거나 app/router.options.ts를 설정하자. 페이지는 Vue 구성 요소이며 Nuxt가 지원하는 유효한 확장자(기본적으로 .vue, .js, .jsx, .mjs, .ts 또는 .tsx)를 가질 수 있다. Nuxt는 ~/pages/ 디렉토리의 모든 페이지에 대한 경로를 자동으로 생성한다. pages/index.vue Index page pages/index.ts // pages/index.ts..

패키지 관리자(npm, yarn, pnpm 또는 bun)는 프로젝트의 종속성을 저장하는 node_modules 디렉터리를 만든다. 이 디렉터리를 .gitignore 파일에 추가하여 종속성을 저장소에 푸시하지 않도록 해야한다.

애플리케이션을 구축하는 동안 개발한 로컬 모듈을 배치하기에 좋은 장소이다. 자동 등록된 파일 패턴은 다음과 같습니다. modules/*/index.ts modules/*.ts nuxt.config.ts 에 해당 로컬 모듈을 별도로 추가할 필요는 없다. modules/hello/index.ts // modules/hello/index.ts // `nuxt/kit` is a helper subpath import you can use when defining local modules // that means you do not need to add `@nuxt/kit` to your project's dependencies import { createResolver, defineNuxtModule, addS..

Nuxt는 특정 경로로 이동하기 전에 코드를 실행하기 위한 미들웨어를 제공한다. Nuxt 는 애플리케이션 전체에서 사용할 수 있는 사용자 정의 가능한 경로 미들웨어 프레임워크를 제공하며, 특정 경로로 네비게이션 되기 전에 실행된다. 경로 미들웨어에는 세 가지 종류가 있다. 익명(또는 인라인) 경로 미들웨어는 페이지 내에서 직접 정의됩니다. 명명된 경로 미들웨어는 middleware/ 에 배치되고 페이지에서 사용될 때 비동기 임포트를 통해 자동으로 로드된다. 전역 경로 미들웨어는 middleware/ 접미사 .global 에 배치되고 경로가 변경될 때마다 실행된다. 처음 두 종류의 경로 미들웨어는 definePageMeta 에서 정의할 수 있다. 미들웨어 이름은 kebab-case로 정규화된다. myMid..

Nuxt는 일반적인 UI 패턴을 재사용 가능한 레이아웃으로 추출하는 레이아웃 프레임워크를 제공한다. 최상의 성능을 위해 이 디렉터리에 있는 구성 요소는 사용 시 비동기 가져오기를 통해 자동으로 로드된다. 레이아웃 활성화 레이아웃은 을 app.vue 에 추가하여 활성화된다. 레이아웃을 사용하려면: definePageMeta 를 사용하여 페이지에 layout 속성을 ​​설정한다. 에 name 속성을 설정한다. 레이아웃 이름은 kebab-case로 정규화되므로 someLayout 은 some-layout 이 된다. 레이아웃을 지정하지 않으면 layouts/default.vue 이 사용된다. 애플리케이션에 레이아웃이 하나만 있는 경우 app.vue 를 사용하는 것이 좋다. 다른 구성 요소와 달리 레이아웃에는 N..

content/ 디렉터리를 사용하여 응용 프로그램에 대한 파일 기반 CMS를 만듭니다. Nuxt Content 는 프로젝트의 content/ 디렉토리를 읽고 , .md, .yml, .csv 및 .json 파일을 사용하여 애플리케이션용 파일 기반 CMS를 만다. 내장된 구성요소를 사용하여 콘텐츠를 렌더링한다. MongoDB와 유사한 API를 사용하여 콘텐츠를 쿼리한다. MDC 구문을 사용하여 Markdown 파일의 Vue 구성 요소를 사용한다. 네비게이션을 자동으로 생성한다. Nuxt 콘텐츠 활성화 프로젝트에 @nuxt/content 모듈을 설치하고 다음 명령을 사용하여 nuxt.config.ts 에 추가한다. # 터미널 npx nuxi module add content 콘텐츠 만들기 마크다운 파일을 co..