Nuxt practice (basic service side rendering) is simply the vm vue instance rendered as html

Disclaimer: This article is a blogger original article, follow the CC 4.0 BY-SA copyright agreement, reproduced, please attach the original source link and this statement.

This link: https://blog.csdn.net/weixin_44195250/article/details/99293827

1, build a folder last point vue:

2, built vuessr folder in the folder last point vue

3、cmd

4, are sequentially input on the command line
. 1, the init NPM -Y
2, the Add Yarn Express
. 3, the install VUE VUE-NPM-Server the renderer --save

5, create a folder server.js

const vue =require("vue");
const express = require("express")
const app = express();

app.use("/",(req,res)=>{
    res.send("123")
})

app.listen(9000)

6, the change package.json
in "scripts": {

}for

"scripts": {
    "dev": "supervisor server"
  },

7, in the command line
yarn dev

8, browser type http: // localhost: 9000 /
results are as follows:

9, continued in server.js

const Vue =require("vue");
const express = require("express")
const app = express();

const vm = new Vue({
    template:`
  <div>{{message}}</div>
    `,
    data:{
        message:1910
    }
})

app.use("/",(req,res)=>{
    res.send("123")
})

app.listen(9000)

Because rendering

const vm = new Vue({
    template:`
  <div>{{message}}</div>
    `,
    data:{
        message:1910
    }
})

Onto the page, res.send does not recognize this string of code need to use
third-party tools: createRenderer

Therefore server.js code as follows:

const Vue =require("vue");
const express = require("express")
const app = express();
const createRender = require("vue-server-renderer").createRenderer();

const vm = new Vue({
    template:`
  <div>{{message}}</div>
    `,
    data:{
        message:1910
    }
})

app.use("/",(req,res)=>{

    
    createRender.renderToString(vm,(err,html)=>{
        res.send(html)
    })
   
})

app.listen(9000)

But this can not be achieved server to render the page jump
no routing and no vuex
it is necessary to use the Nuxt