vue-server-renderer实现ssr简单的demo(一)

    科技2024-07-26  61

    需要下载的依赖有 express vue vue-server-renderer

    const Vue = require('vue') const server = require('express')() const renderer = require('vue-server-renderer').createRenderer() server.get('*', (req, res) => { const app = new Vue({ data: { url: req.url }, template: '<div>furfur-jiang {{url}}</div>' }) renderer.renderToString(app, (err, html) => { if (err) return res.end(`<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> ${html} </body> </html>`) }) }) server.listen('8080', () => { console.log('ok') })

    运行node server.js 学习来源:https://www.bilibili.com/video/BV1qz4y1d7Lr

    Processed: 0.009, SQL: 9