自从出现前后端分离概念后。前端越来越注重页面交互,后端越来越注重数据逻辑。对于前端来说,出现了一大批javascript框架。其中深受开发者欢迎的框架为React Vue Angular。
本篇介绍一下vue相关内容。
说起前端,人们第一想法就是做网站。而对于一个网站除了有一个好的页面展示以及交互效果外。另一个重要的就是检索引擎优化。就是所谓SEO优化。然而对于前端来说。不管是React Vue 或者angrlar 所开发出来的都是单页应用(single-page application,缩写SPA)。对于网站的seo优化来说什么不友好。于是出现的另一种方式:服务端渲染(server side render 缩写SSR)
什么是nuxt?
由于vue自己无法进行服务端渲染。于是出现了利用第三方库集成方式来实现服务端渲染。而在这其中比较优秀的就是Nuxt这个框架。
从官网中介绍来看:
Nuxt.js 是一个基于 Vue.js 的通用应用框架。
通过对客户端/服务端基础架构的抽象组织,Nuxt.js 主要关注的是应用的 UI渲染 。
我们的目标是创建一个灵活的应用框架,你可以基于它初始化新项目的基础结构代码,或者在已有 Node.js 项目中使用 Nuxt.js。
Nuxt.js 预设了利用 Vue.js 开发 服务端渲染 的应用所需要的各种配置。
除此之外,我们还提供了一种命令叫:nuxt generate ,为基于 Vue.js 的应用提供生成对应的静态站点的功能。
我们相信这个命令所提供的功能,是向开发集成各种微服务(Microservices)的 Web 应用迈开的新一步。
作为框架,Nuxt.js 为 客户端/服务端 这种典型的应用架构模式提供了许多有用的特性,例如异步数据加载、中间件支持、布局支持等。
特性
- 基于 Vue.js
- 自动代码分层
- 服务端渲染
- 强大的路由功能,支持异步数据
- 静态文件服务
- ES2015+ 语法支持
- 打包和压缩 JS 和 CSS
- HTML 头部标签管理
- 本地开发支持热加载
- 集成 ESLint
- 支持各种样式预处理器: SASS、LESS、 Stylus 等等
- 支持 HTTP/2 推送
流程图
由于nuxt是一个基于vue的通用框架。开箱即用。于是他继承了vue几乎所有的特性。而然为了达到开箱即用让开发者更加专注于业务开发的目的。它替换了vue部分特性内容。用nuxt特有的方式进行取代。