vue预渲染prerender-spa-plugin报错Unable to prerender all routes!

在项目中使用了vue的预渲染

web
    ---src
        ---main.js
    ---vue.config.js 配置插件
server
    ---web web项目打包后的静态页面挂载到server的web目录下

项目结构如上

vue.config.js

  publicPath: process.env.NODE_ENV === 'production'
    ? '/'
    : '/',
  outputDir: path.join(__dirname, '../server/web'),
  configureWebpack: config => {
    if (ENV === 'production') { // 生产环境下
      // 服务器配置预加载
      config.plugins.push(new PrerenderSpaPlugin({
        staticDir: path.join(__dirname, '../server/web'),
        routes: ['/', '/articles/:id', '/hero/:id'], // Required - Routes to render
        renderer: new Renderer({
          headless: true, // 无头浏览器
          renderAfterDocumentEvent: 'render-event',
          renderAfterTime: 5000
        })
      }))
      // 不打包第三方包
      config.externals = {
        'vue': 'Vue',
        'vue-router': 'VueRouter',
        'axios': 'axios'
      }
    }
  }

main.js中

new Vue({
  router,
  render: h => h(App),
  mounted() {
    // 预编译
    document.dispatchEvent(new Event('render-event')) 
  }
}).$mount('#app')

每次npm run build的时候,会报错Unable to prerender all routes!

阅读 7k
1 个回答
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题