Nuxt.js简单的说是Vue.js的通用框架,最常用的就是用来作SSR(服务器渲染)。再直白点说,就是Vue.js原来是开发SPA(单页应用)的,但是随着技术的普及。很多人想用Vue开发多页应用,并在服务端完成渲染。这时候就出现了Nuxt.js这个框架,它简化了SSR的开发难度。还可以直接用命令把我们制作的vue项目生成为静态html。
那服务端渲染到底有什么好处哪?
最主要的原因是SPA单页应用不利于搜索引擎的SEO操作。比如你做一个新闻网站,流量的一个主要来源是通过百度、谷歌、bing这些搜索引擎,但是它们对SPA的抓取并不好,特别是百度根本没法抓取到SPA的内容页面,所以我们必须把我们的应用在服务端渲染成适合搜索引擎抓取的页面,再下载到客户端。那Nuxt.js适合做新闻、博客、电影、咨询这样的需要搜索引擎提供流量的项目。如果你要作移动端的项目,就没必要使用这个框架了。Nuxt.js个人觉得是一个解决方案
什么是SSR?
SSR,即服务器渲染,就是在服务器端将对Vue页面进行渲染生成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特点(优点):
nuxt框架将页面分层划分为3层:1、布局;2、页面;3、组件
- 基于Vue.js
- 自动代码分层
- 服务端渲染
- 强大的路由功能,支持异步数据
- 静态文件服务
- ES6/ES7语法支持
- 打包和压缩JS和CSS
- HTML头部标签管理
- 本地开发支持热加载
- 集成ESLint
- 支持各种样式预处理器:SASS、LESS、Stylus等
项目的运行顺序:1.Middleware层-->2.layouts层-->3.pages层-->4.components层
Nuxt.js官网介绍:Nuxt - The Intuitive Vue Framework