Vue ssr失败，渲染的html为undefined

Question

想试着写一个ssr demo，不带路由，不带数据预取的。官网文档中的基本用法demo的照写了运行没问题，但当我想换成组件式开发的时候就出问题了，渲染出来的页面是空的，这是我的代码，麻烦帮忙看看

这是entry-client.js

import { createApp } from './app'

const { app } = createApp()

app.$mount('#app')

这是entry-server.js

import { createApp } from './app'

export default context => {

  const { app } = createApp()

  return app

}

这是app.js

import Vue from 'vue'

import App from '../../component/test/App.vue'

export function createApp () {

  const app = new Vue({

    render: h => h(App)

  })

  return { app }

}

这是server.js

const server = require('express')()

const { createBundleRenderer } = require('vue-server-renderer')

const renderer = createBundleRenderer('./dist/vue-ssr-server-bundle.json', {

  runInNewContext: false, 

  template: require('fs').readFileSync('./views/test/test.html', 'utf-8')

})

server.get('*', (req, res) => {

  renderer.renderToString( (err, html) => {

    res.end(html)

  })

}).listen(8899)

这是webpack打包服务端的代码

const merge = require('webpack-merge')

const nodeExternals = require('webpack-node-externals')

const baseConfig = require('./webpack.common.js')

const VueSSRServerPlugin = require('vue-server-renderer/server-plugin')

module.exports = merge(baseConfig, {

  entry: './js/test/entry-server.js',

  target: 'node',

  devtool: 'source-map',

  output: {

    libraryTarget: 'commonjs2'

  },

  externals: nodeExternals({

    whitelist: /\.css$/

  }),

  plugins: [

    new VueSSRServerPlugin()

  ]

})

我的运行步骤是，先 webpack --config webpack.ssr.js，会成功打包出vue-ssr-server-bundle.json文件,之后node server.js，但是渲染失败，页面是空白的。

Answer 1

解决了，./dist/vue-ssr-server-bundle.json不能是相对路径，必须绝对路径