From 076af3e6e7ffa9db87671f867bb9783610deb021 Mon Sep 17 00:00:00 2001 From: JackXie60 <1809697652@qq.com> Date: Sat, 3 Sep 2022 13:28:06 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=E5=AE=8C=E6=88=90=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app.js | 10 ++++++++++ client.js | 3 +++ server.js | 36 ++++++++++++++++++++++++++++++++++++ 3 files changed, 49 insertions(+) create mode 100644 app.js create mode 100644 client.js diff --git a/app.js b/app.js new file mode 100644 index 0000000..ec8b03d --- /dev/null +++ b/app.js @@ -0,0 +1,10 @@ +import {createSSRApp} from 'vue' + +export const createApp = () => { + return createSSRApp({ + data: () => ({ + content: 'Vue SSR Template' + }), + template: `
{{content}}
` + }) +} \ No newline at end of file diff --git a/client.js b/client.js new file mode 100644 index 0000000..e081caa --- /dev/null +++ b/client.js @@ -0,0 +1,3 @@ +import { createApp } from "./app.js"; + +createApp().mount("#app"); \ No newline at end of file diff --git a/server.js b/server.js index a5cefe0..2234c04 100644 --- a/server.js +++ b/server.js @@ -1 +1,37 @@ // TODO 监听3000端口，便于执行test +import express from "express"; +import { createApp } from "./app.js"; +import {renderToString} from 'vue/server-renderer' + +const server = express(); + +server.get('/', (req, res) => { + const app = createApp(); + renderToString(app).then(html => { + res.send(` + + + + vue ssr page + + + + +
${html}
+ + + `) + }) +}) + +server.use(express.static('.')); + +server.listen(3000, () => { + console.log("服务已启动"); +}) \ No newline at end of file From f1b46bf05f69ac699b0be43d661c844ccaff21b7 Mon Sep 17 00:00:00 2001 From: JackXie60 <1809697652@qq.com> Date: Sun, 4 Sep 2022 11:09:34 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=E5=AE=8C=E6=88=90=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app.js b/app.js index ec8b03d..9dfa831 100644 --- a/app.js +++ b/app.js @@ -3,7 +3,7 @@ import {createSSRApp} from 'vue' export const createApp = () => { return createSSRApp({ data: () => ({ - content: 'Vue SSR Template' + content: 'Vue SSR Example' }), template: `
{{content}}
` })