众所周知，如今前端SPA模式开发有三大框架三足鼎立：Angular、React、Vue；这三个框架非常优秀、并且生态各方面都比较好，而我独宠Vue。
其中原生Vue渲染模式是CSR，这种渲染模式不利于搜索引擎的搜录；而我司项目比较依赖搜索引擎的流量、加上后端初转前端的我只会Vue,搜索了大量资料、最终觉得Nuxt.js比较适合我这种新手。其已为开发者提供了许多配置，开箱即用，不费吹灰之力达到SSR效果。
什么是CSR和SSR呢？
估计许多不太熟悉的朋友不明白CSR和SSR是什么；简单来讲：
CSR：页面内容由JS在客户端浏览器渲染。
SSR：页面内容在服务器端渲染完成后返回给客户端
一句话总结nuxt.js是什么？
Nuxt.js是基于Vue 达到服务端渲染的一个框架。
怎么学习和使用Nuxt.js
首先学习Vue基础、把Vue看/练一遍后，然后就去啃Nuxt.js文档吧， 啃不动就结合着网上的文章和视频教程来；官网文档很重要。官网文档地址：https://zh.nuxtjs.org
创建Nuxt.js项目（脚手架）
此时，你已经安装好了Node、Npm、Npx（npx在安装npm时就自动安装了）
- 运行Nuxt.js创建命令
npx create-nuxt-app <项目名>
- 稍等一会后，会有如下提示操作：
2.1. 输入当前项目名，回车即默认（myapp）
2.2. 输入当前项目描述，回车即默认（My W…）
2.3. 输入当前项目作者，回车即默认（144157）
2.4. 选择使用哪种包管理工具（我选择Npm）
2.5. 选择项目所需UI框架（常用的都有，我暂不选择）
2.6. 选择集成服务端框架
2.7. 选择HTTP请求（我选择axios）
2.8. 选择代码检查工具（我选择ESLint）
2.9. 选择测试框架（我选择None）
2.10. 选择Nuxt模式（我选择SSR）
2.11 这个随便选吧（对我来说没用）
执行安装：
- 当看到如下图所示时，我们这个新Nuxt.js项目已经创建完成了。
运行
- 切换到项目文件夹
cd myapp - 本地开发运行
npm run dev - 项目编译
npm run build - 编译后运行
npm start
文件夹目录结构说明
|-- assets 用来存放未编译的静态资源，如：CSS,JS, 图片,字体（返回时会以base64格式返回）
|-- comments 用来存放项目中的组件
|-- layouts 用来存放项目中的布局组件
|-- middleware 用来存放项目中的中间件
|-- pages 用来存放项目中页面视图及路由
|-- plugins 用来存放项目中插件
|-- static 用来存放项目中的静态资源
|-- Store 用来存放项目中的Vuex状态树文件
|-- nuxt.config.js 本Nuxt.js 项目的个性化配置
|-- package.json 用于记录安装的依赖包和对外暴露的脚本接口
初始Nuxt.js先更到这里，下期更新常见配置。
如有疑问请留言；或联系邮箱：zhanghaoran.ren@qq.com
转载请注明出处。