vue3简单实现SSR

vue2时代做ssr一般使用vue2+vue-server-renderer可以实现SSR功能,但是vue3中会报错

Vue packages version mismatch: - [email protected] - [email protected] This may cause things to work incorrectly. Make sure to use the same version for both.

意思是需要使用相同版本的vue和vue-server-renderer,但是后者并没有3.0的版本,所以网上查了下,发现vue3可以不使用插件就实现SSR,就是原生支持。

然后写了个小damo发现确实如此。

const express = require('express');
const { createSSRApp } = require('vue');
const { renderToString } = require('@vue/server-renderer');
let app = express();

const vm = createSSRApp({
	template: `
    
123
`, }); app.get('/', async function (req, res) { try { const html = await renderToString(vm); res.send(html); } catch (error) { res.status(500).send('系统内部错误'); } }); app.listen(3000, () => { console.log('渲染服务器启动成功!'); });

你可能感兴趣的:(vue.js,javascript,前端)