vue.js - Vue SPA - PhantomJS 成功运行，但 Fetch As Google 显示空白

Question

我的团队使用 Vue 构建了一个 SPA ( https://tutorismhk.com/ )。在进行 SEO 时，我们发现 Fetch As Google 无法呈现页面(在预览中显示空白页面)。没有显示错误消息。

我们已经使用 PhantomJS v2.1.1 进行了测试 - 使用它从我们的本地计算机呈现上述 URL 并将屏幕捕捉到图像中。它运作良好。

关于我们如何调试它的任何想法？

Answer 1

经过反复试验，我们找到了解决方法。我们的应用程序存在两个问题。

1. 我们手动安装了最新的 babel-polyfill。我猜它会导致一些不兼容的问题。

2. 似乎在将@vue/cli-plugin-babel 升级到 v3.4.0 之后，我们拥有的其他依赖项(在我们的例子中是 vue-izitoast v1.1.2)开始出现一些问题。

在卸载 babel-polyfill 并将@vue/cli-plugin-babel 降级到 v3.3.0 后，Fetch As Google 成功渲染了我们的页面。