|
示例一
1.项目搭建 mkdir ssr1 // 新建文件夹ssr1 cd ssr1 // 进入文件夹ssr1 cnpm init // 初始化 cnpm i vue vue-server-renderer --save // 安装插件vue、vue-server-renderer cnpm i express --save // 安装插件express 2.在根目录下创建server.js文件 const Vue = require('vue')
const express = require('express')()
const renderer = require('vue-server-renderer').createRenderer()
const app = new Vue({
template:'<div>hello world</div>'
})
express.get('/',(req,res)=>{
renderer.renderToString(app,(err,html)=>{
if(err){
return res.state(500).end('运行时错误')
}
res.send(`
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue2.0 SSR渲染页面</title>
</head>
<body>
${html}
</body>
</html>
`)
})
})
express.listen(8080,()=>{
console.log('服务器已经启动!')
})3.输入node server.js启动服务,在浏览器输入http://localhost:8080访问 参考:https://www.jianshu.com/p/0fa36558f84e |
|