VUE SSR

发布时间 2023-03-28 13:50:51作者: 中亿丰数字科技

1 简介

概念:ssr(server side render)服务端渲染

优点:

1.有利于搜索引擎的SEO操作,由于搜索引擎爬取的是完全渲染出来的页面。

2.对于网络慢或运行慢的设备,可提供良好的用户体验。

3.可以减少对服务器的请求。

缺点:

1.开发受限制,比如mounted生命周期钩子不能用了,因为它只有在客户端页面转换成SPA页面的过程中才会被激活,而ssr只是将服务端生成的html字符串传递给客户端,所以不会执行该生命周期钩子。

2.构建和部署的要求比较多,比如服务端要配置node.js环境。

3.服务端负载高。

2 创建ssr项目

注意:ssr项目是创建在服务器端的!

2.1 安装vue-cli

PowerShell
npm install -g @vue/cli      # 安装vue-cli 3.0

vue --version                # 安装完vue-cli,就可以使用vue命令查询vue/cli版本,最新版4.x

2.2 创建项目

PowerShell
vue create myapp

2.3 安装依赖

PowerShell
npm i vue-server-render -D    # 安装渲染器 vue-server-render

npm i express -D              # nodejs服务器 express