Nuxt.js（一）

Nuxt.js概述

SEO和SSR对比

SEO：搜索引擎优化（Search Engine Optimization）, 通过各种技术（手段）来确保，我
们的Web内容被搜索引擎最大化收录，最大化提高权重，最终带来更多流量
非常明显，SPA程序不利于SEO

SEO解决方案：提前将`页面和数据`进行整合
* 前端：采用SSR
* 后端：页面静态化 （freemarker 、thymeleaf、velocity）
* *************************

什么是SSR技术

服务端渲染（Server Side Render），即：网页是通过服务端渲染生成后
输出给客户端。	
* 在SSR中，前端分成2部分：前端客户端、前端服务端
* 前端服务端，用于发送ajax，获得数据
* 前端客户端，用于将ajax数据和页面进行渲染，渲染成html页面，并响应给调用程序
（浏览器、爬虫）

SPA和SSR对比

什么是Nuxt.js

* Nuxt.js 是一个基于 Vue.js 的通用应用框架。
* 通过对客户端/服务端基础架构的抽象组织，Nuxt.js 主要关注的是应用的 **UI 渲染**。
* Nuxt.js 预设了利用 Vue.js 开发**服务端渲染**的应用所需要的各种配置。

Nuxt安装

前序

* Nuxt.js 提供了脚手架工具 `create-nuxt-app`

* `create-nuxt-app` 需要使用 `npx`

* npx 命令为 NPM版本5.2.0默认安装组件

安装

npx create-nuxt-app 项目名

启动

npm run dev

访问

http://localhost:3000

目录结构