1

当我尝试使用 Vuejs 2.0 设置服务器端渲染时,我的项目遇到了这个问题:

h is not a function

TypeError: h is not a function
  at VueComponent._default (__vue_ssr_bundle__:3158:17)

我的client-entry.js文件:

import { app } from './index'
app.$mount('#app')

我的server-entry.js文件:

import { app } from './index'
export default context => {
  router.push(context.url).
  return new Promise((resolve, reject) => {
    resolve(app);
  })
}

webpack的服务器构建配置:

var webpackConfig = merge(baseWebpackConfig, {
  target: 'node',
  entry: './vue/server-entry.js',
  output: Object.assign({}, baseWebpackConfig.output, {
    path: 'dist/server',
    filename: 'server-bundle.js',
    libraryTarget: 'commonjs2'
  }),
  externals: Object.keys(require('../package.json').dependencies),
  plugins: [
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': '"production"',
      'process.env.VUE_ENV': '"server"'
    })
  ]
})

还有我的server.js文件:

var layout = fs.readFileSync('./dist/index.html', 'utf8')
const code = fs.readFileSync('./dist/server/server-bundle.js', 'utf8')
const bundleRenderer = require('vue-server-renderer').createBundleRenderer(code)
var express = require('express')
var server = express()
server.get('*', (request, response) => {
  bundleRenderer.renderToString((error, html) => {
    if (error) {
      console.log(error)
      return response
        .status(500)
        .send(JSON.stringify(error))
    }
    response.send(layout.replace('<div id="app"></div>', html))
  })
})

PS:我的客户端构建工作正常。

4

1 回答 1

0

h是通常在渲染函数中赋予createElement参数的名称,在使用 jsx 时必须这样命名

于 2016-10-26T16:53:47.510 回答