ssr服务端渲染搭建

前提:需要安装了vue-cl node

1.npm init -y初始化一个项目

2.修改package.json文件 

3.新建一个server.js文件

4.添加相关代码server.js

const Vue = require('vue')
//1.创建vue实例
const app = new Vue({
    template:`<div>hello</div>`
})
//2.创建渲染函数
const renderer = require('vue-server-renderer').createRenderer();
//3.将vue实例渲染为html
// renderer.renderToString(vue实例,(错误,渲染后的html)=>{})
// renderer.renderToString(app,(err,html)=>{
//     if(err) throw err;
//     console.log(html)
// })

//在2.5.0+如果没有传入回调函数,则回返回promise 执行需要注释上面的方法
renderer.renderToString(app).then((html)=>{
    console.log('html',html)
}).catch((err)=>{
console.log('err',err)
})

5.本来已经写好了一篇很完整的 不知道是不是bug的原因 居然没有保存到 刷新下页面都没了 然后我就简单写了下了

相关代码已上传到码云上 附上链接

太久没写了 请大家多多指教

 

posted on 2021-11-24 16:58  皮皮聪  阅读(117)  评论(0编辑  收藏  举报

导航