0

我正在尝试配置prerender-spa-plugin为使用我的 vue.js (1.x) 应用程序。当我在没有它的情况下构建应用程序时 - 一切正常，但我需要为 SEO 目的预先渲染页面。

当我安装插件时，它会进行预渲染，但随后会显示一些路由器错误（[vue-router] Uncought error during transition）以及TypeError: undefined is not an object (evaluating 's(e).isEqualNode'). 同样 - 如果我在没有pretender-spa-plugin.

关于工具的一些信息：

- Mac OS
- node v6.10.1
- quasar --version 0.5.2 (project runs using quasar framework)
- npm -v3.10.10
- vue.js (1.x)

然后，相关设置为：

webpack.prod.conf.js

module.exports = {
  plugins: [
  new PrerenderSpaPlugin(
    // Absolute path to compiled SPA
    path.join(__dirname, '../dist'),
    // List of routes to prerender
    [ '/',  '/apps'],
    {
       captureAfterDocumentEvent: 'custom-post-render-event',
       captureAfterTime: 2000,
       ignoreJSErrors: false,
       captureAfterElementExists: '.main',
    } 
  )
 ]

div.main实际上存在于我需要预渲染的每个组件中

main.js

document.addEventListener('DOMContentLoaded', function () {
  Quasar.start(() => {
    Router.start(App, '#quasar-app')
  })
  document.dispatchEvent(new Event('custom-post-render-event'))
})

应用程序.vue

module.exports = {
  replace: false,
  ....

我已经尝试过的：

  1. 不要使用这些触发器中的一些，我在此处为 webpack 编写了这些触发器。我想我已经尝试了所有可能的组合 - 有时构建过程只是挂起，有时 - 它编译时遇到了同样的问题。

  2. 即使在我最初的 app.vue 文件中，我也尝试设置此自定义，并将其附加到ready ()- 结果相同

  3. 我也尝试指定replace: false所有内部组件-同样的结果-它总是给我路由器错误，然后显示在每条路由上呈现的索引页面（以及应该存在的内容）

  4. 唯一“帮助”的是不/为插件指定路由。然后，我的索引组件没有预渲染，所有其他的都可以正常工作。但显然我也需要预先渲染它。

非常欢迎任何帮助或建议！也许，我错过了一些quasar framework具体的东西？

我也在用html-webpack-plugin，难道是因为它？

谢谢！

4

1 回答 1

0

好的，问题似乎出在vue-helmet插件中。我不知道为什么，但在我安装 prerender 之前一切正常（vue-helment用于管理单独页面上的元数据）。但是当一起使用时——它们会产生冲突。所以，我刚刚找到了另一种管理元数据的解决方案，它也适用于预渲染。现在，一切都很好

于 2017-04-07T06:04:10.440 回答