示例一
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 |
|