nuxtjs服务端SEO

NUXT优点:
1nuxtjs服务端SEO
2加载快:普通页面先加载页面,如果有ajax需要又请求一次服务器
3.nuxtjs不用手动设置路由,直接在服务端渲染成静态页面
4.about 页面种,添加路由组件链接
params传参:news
news页面中{{$route.params.xxid}}

动态路由:
validate({params}){
console.log(params.id)
return params.id ===‘9527’ //如果返回非9527,就跳到404页面
}

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

安装步骤:
npm i -g create-nuxt-app //全局安装工具
1、npx create-nuxt-app study-nuxt //创建文件
nuxt.config.js
2、可以配置全局的meta,link,title, cs,modules,proxy等
3、自动生成路由

遇到的问题和解决方法:
首页白屏
最后只能把首页内的代码作为一个组件引入首页 就解决了…

window not find
因为是服务器端渲染所以没有windows,document
解决方法 把windows放到mounted中就好 尽量少用windows

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

前端段

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值