본문 바로가기

Web Front-End/Nuxt

(3)
Nuxt.js 웹 프로젝트 시작하기 1. Node.js 설치(모든 작업에서 선행되어야함) - 노드 사이트에서 LTS 버전을 손쉽게 설치한다..(Next > Next > 수준으로 쉽게 설치 가능) - 작성기준 Node의 버전은 "10.16.3 LTS" https://nodejs.org/en/ 2. 프로젝트 생성 - yarn을 이용하여 프로젝트를 구성하려면 "npm install -g yarn" 글로벌 옵션으로 yarn 설치(현시점 1.19.1 버전) - 실제 프로젝트 생성(명령 프롬프트 현재 디렉토리에 생성됨) 1) "yarn create nuxt-app " 2) or.... "npx create-nuxt-app " 3) or.... "npm init nuxt-app " 3. 프로젝트 옵션 선택(필요에 따라 선택하면됨) - 프로젝트명: 엔터..
nuxt build ? generate ? nuxt build --spa ? 차이? 1. nuxt build : SSR(Server Side Rendering) 을 포함한 정규 빌드 2. nuxt generate : Prerendering 된 SPA(Single Page Application) 3. nuxt build --spa : Prerendering 없는 순수 SPA(Single Page Application) 위명령어는 프로젝트 루트에서.. 사용!
Nuxt.js SSR(Server Side Rendering) 환경 1. 프로젝트 생성 및 초기화 - nuxt.js starter 템플릿을 이용하는 방법 or 직접 시작하는 명령어 - nuxt 패키지만 다운로드하면 vue, vue-router, vuex 등의 패키지가 모두 설치됨 - "nuxt build" 명령어는 Webpack을 이용해 애플리케이션을 빌드할 수 있기때문에 배포시 적절 - "nuxt start" 명령은 운영 버전으로 서버를 시작함. 그전에 build가 선행되어야함 - "nuxt generate"명령은 애플리케이션을 빌드후 모든 경로의 화면을 정적 HTML로 생성함 nuxt 태그는 router-view 요소 역할을 대신함 nuxt-child 태그는 vue-router의 router-view와 동일 nuxt-link 태그는 vue-router의 router-..