Nuxt.js是什么?
Nuxt.js 是一个基于 Vue.js 的通用应用框架。 通过对客户端/服务端基础架构的抽象组织，Nuxt.js 主要关注的是应用的 UI渲染。
为什么要用Nuxt.js?
普通的SPA（单页应用）不利于搜索引擎的SEO操作;尤其是像新闻资讯一类主要吸收流量的项目如果不能被搜索引擎的,那将是致命的;
Nuxt.js做了?
首先我们来看看Nuxt.js的特性:
- 基于 Vue.js
- 自动代码分层
- 服务端渲染
- 强大的路由功能，支持异步数据
- 静态文件服务
- ES6/ES7 语法支持
- 打包和压缩 JS 和 CSS
- HTML头部标签管理
- 本地开发支持热加载
- 集成ESLint
- 支持各种样式预处理器： SASS、LESS、 Stylus等等
- 支持HTTP/2 推送
这里其他的我们先不用理会其它,只考虑上面普通的SPA（单页应用）不利于搜索引擎的SEO操作这一项问题?
那么重点就来了---服务端渲染
服务器渲染，即SSR，就是在服务器端将对Vue页面进行渲染生成html文件，将html页面传递给浏览器。
SSR两个优点：
各文件夹作用 :
- SEO 不同于SPA的HTML只有一个无实际内容的HTML和一个app.js，SSR生成的HTML是有内容的，这让搜索引擎能够索引到页面内容。
- 更快内容到达时间 传统的SPA应用是将bundle.js从服务器获取，然后在客户端解析并挂载到dom。而SSR直接将HTML字符串传递给浏览器。大大加快了首屏加载时间。
- |-- .nuxt // Nuxt自动生成，临时的用于编辑的文件(这个文件夹着重看看)
- |-- assets // 用于组织未编译的静态资源,如LESS、SASS 或 JavaScript
- |-- components // 用于自己编写的Vue组件，比如轮播组件，日历组件，分页组件
- |-- layouts // 布局目录，用于组织应用的布局组件(里面存放每个页面公用的组件,如:导航栏)
- |-- middleware // 用于存放中间件(如:登陆验证的中间件)
- |-- pages // 用于存放写的页面，我们主要的工作区域
- |-- plugins // 用于存放JavaScript插件的地方
- |-- static // 用于存放静态资源文件(如:图片)
- |-- store // 用于组织应用的Vuex 状态管理
- |-- .editorconfig // 开发工具格式配置
- |-- .eslintrc.js // ESLint的配置文件，用于检查代码格式
- |-- .gitignore // 配置git不上传的文件
- |-- nuxt.config.json // 用于组织Nuxt.js应用的个性化配置，用来覆盖默认配置
- |-- package-lock.json // npm自动生成，用于帮助package的统一性设置的
- |-- package-lock.json // npm自动生成，用于帮助package的统一性设置的
- |-- package.json // npm包管理配置文件
官网链接:戳这里~