Nuxt

TIP

最后更新时间:2019年9月17日

字数:

教学资源

网页渲染方式

前端渲染

服务端渲染

服务端渲染:SSR:server side render

服务器渲染优点

  • 更利于SEO
  • 更利于首屏渲染-节省时间

服务器渲染缺点

  • 服务端压力较大
  • 开发受限,因为服务器环境和浏览器环境存在差异,比如:
    • 框架的生命周期函数有些无法执行
    • document,window对象无法使用
    • 类似小程序无法使用window,因为是jscore,没有界面
  • 学习成本高,需要掌握的技术比较多

怎么去选择

  • 如果注重SEO的新闻站点,非强交互的页面,建议用SSR
  • 像后台管理页面这类强交互的应用,建议使用前端渲染

TIP

小峰哥友情提示:服务器渲染和客户端渲染环境有些情况下是不一样的,一定要注意!!!

Nuxt.js

什么是Nuxt.js

Nuxt.js特性

  • 基于 Vue.js
  • 自动代码分层
  • 服务端渲染
  • 强大的路由功能,支持异步数据
  • 静态文件服务
  • ES6/ES7 语法支持
  • 打包和压缩 JS 和 CSS
  • HTML头部标签管理
  • 本地开发支持热加载
  • 集成ESLint
  • 支持各种样式预处理器: SASS、LESS、 Stylus等等
  • 支持HTTP/2 推送

三大块功能

  • 服务端渲染
  • SPA
  • 静态化(预渲染)

create-nuxt-app

目录结构

路由

路由基本配置

路由跳转

动态路由

路由参数

嵌套路由

组件

第三方引用

网络请求axios

SEO优化

nuxt.config.js

全局SEO

局部SEO