Nuxt.js 단순히 그 공통 프레임 워크 Vue.js, 가장 일반적으로 사용되는 SSR (서버 측 표현)로서 사용되는 것이다. 그리고 퉁명스럽게, Vue.js 원래 개발 SPA (단일 페이지 응용 프로그램)입니다, 넣어하지만, 기술의 인기와 함께, 많은 사람들이 서버에서 다중 페이지 응용 프로그램 및 최종 렌더링을 개발하기 위해 뷰를 사용하고 싶습니다. 이 때 그녀는 SSR의 어려움의 개발을 단순화,이 프레임 워크 Nuxt.js가 있었다. 또한 우리의 명령에 직접 사용할 수있는 정적 HTML로 생성 VUE 프로젝트를했다.
SSR은 무엇인가?
SSR, 즉 렌더링 서버는 HTML 파일이 뷰 페이지, HTML 페이지가 브라우저에 전달 될 것입니다 서버 측에서 렌더링 생성합니다.
SSR 두 가지 장점 :
- SEO는 SPA의 어떤 HTML 다른 HTML과 app.js 단 하나의 실제 내용이며, SSR은 HTML 인덱스로 검색 엔진은 페이지의 콘텐츠를 만드는 내용이다 생성.
- 내용 빠른 도착 시간을 기존의 SPA 응용 프로그램은 서버에서 가져온 bundle.js하고, 다음 DOM 클라이언트를 탑재 해결. SSR의 브라우저에 HTML 문자열로 직접 전달. 크게 첫 번째 화면로드 시간을 단축.
Nuxt.js의 공식 웹 사이트는이 문서입니다 :
Nuxt.js는 Vue.js 기반으로 일반적인 응용 프로그램 프레임 워크입니다. 클라이언트 / 서버 기반의 조직을 추출하여, Nuxt.js 주요 관심사는 응용 프로그램 UI 렌더링입니다.
Nuxt.js는 특징 (장점)이다 :
- 기반 Vue.js
- 자동 코드 계층화
- 사이드 렌더링 서비스
- 강력한 라우팅 기능은 비동기 데이터를 지원합니다
- 정적 파일
- ES6 / ES7 구문 지원
- 패키지 및 압축 JS 및 CSS
- HTML head 태그 관리
- 지역 개발 지원 핫로드
- 통합 ESLint
- SASS, LESS, 스타일러스 등 : 사전 프로세서는 다양한 스타일을 지원합니다
빌드로 A, Nuxt 환경
1. 이미 설치 한 경우,이 단계를 생략 할 수 있습니다,이 프레임 워크 VUE - CLI를 설치 NPM.
NPM 설치 VUE-CLI -g
설치가 완료 VUE이다 -V 설치의 성공 여부를 테스트하는 데 사용할 수 있습니다. (참고 : 여기에 V 대문자 사용, 잘못된 소문자).
2. VUE 설치 nuxt
VUE-CLI를 설치 한 후 Nuxt.js 프로젝트를 초기화 init 명령을 사용할 수 있습니다.
VUE 초기화 nuxt / 스타터
이번에는 그가 다음 프로젝트의 이름은 소위을 요청, GitHub의에 템플릿을 다운로드합니다, 어떤 저자, 이들은 자신의 환경 설정에 따라 입력 할 수 있습니다.
종속성을 설치 NPM 3. 설치
NPM 설치
이 과정은 설치 NPM 다시 설치, 프로젝트 폴더에서이 프로세스가 실패 설치하는 경우, 당황하지 않지만, 당신이 직접 어 삭제할 수 있습니다 후 node_modules 파일을 기다리는 것입니다.
4. 사용 NPM 실행은 서비스를 시작 DEV
NPM 실행 DEV
브라우저 5. localhost를 입력 : 3000, 당신은 결과를 볼 수 있습니다.
안녕하세요