问题标签 [vue-ssr]

我们知道只有路由器组件可以asyncData在 ssr 环境中请求。我有一个主要组件（不是路由器组件），我需要一些异步数据来呈现服务器端。因为它不是路由器组件，所以我不能asyncData用于服务器端渲染。

所以我使用created钩子来调用异步 api，但是组件钩子是同步的，不等待承诺。如何在服务器端获取异步数据？

App.vue - 主要组件

动作.js

我收到错误，因为路由挂钩window中未定义。afterEach

我认为afterEach路由钩子在服务器端渲染时执行，所以window这里没有定义。如果我在这里做错了，请纠正我。如果我没有错，那么是否有任何仅在客户端执行的路由器挂钩？

我有 webpack.server.config

但如果我运行npm run build server- 抛出错误

如何设置 webpack 或者我可以上课吗？Vue.js 官方网站上关于设置的信息不是很丰富也许我需要更改webpack.base.config 的逻辑？如果有人可以就主题主题或ssr + express的主题提供帮助-我将非常感激

我决定构建自己的 Vue SSR模板，用于我的项目。它部分基于此示例。一切都很好，并按预期工作。它仍然在开发服务器上）但是当我为生产构建应用程序时，我突然发现它完全死了。我没有错误，没有警告，没有其他迹象可以指出我应该寻找答案的方向......这让我大吃一惊！

该应用程序在开发服务器上完美运行，但在生产中，由于客户端水合以某种方式失败，它似乎完全死了。

我不确定它到底是什么......或者我只是愚蠢到错过了一些非常简单的东西。我只是不知道。我花了很多时间试图解决这个问题......但什么也没找到，我感到很无助。所以任何帮助将不胜感激！

我正在按照指南https://ssr.vuejs.org/en/data.html构建一个应用程序。

所以我有结构：

服务器.js

store.js

路由器.js

main.js

入口-server.js

entry-client.js

成分

BlogEn.vue

内容.vue

当我加载页面 /en/blog 我在浏览器中的 DOM 看起来像

但！当我查看服务器发送给我的源代码页和 html 时，它可以。

那不是全部。我的应用程序中有其他页面，我没有在这里显示。当我在任何页面移动并在 DOM 正常后转到“/en/blog”时。

这里有什么问题？

我有一个插件（bootstrap-vue），我想用Vue.use(). 现在，我在客户端条目（内部router.onReady()）中使用它，但收到以下警告：

客户端渲染的虚拟 DOM 树与服务器渲染的内容不匹配。<p>这可能是由不正确的 HTML 标记引起的，例如在<tbody>. Bailing 水合作用并执行完整的客户端渲染。

我使用服务器端渲染（SSR）并且不确定在哪里正确调用插件初始化。谢谢！

Let's boil it down to the minimum.

I have this little component here that fetches data from the server. The diference with this component and any other is that it has to do two AJAX calls. One after the other!

The thing is this works perfect is all requests work. But if something goes wrong and I do:

It works perfect in the browser, meaning I go to '/404' but on NodeJS I keep getting this message.

UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)

Has anybody done something similar?

我正在尝试从 HTTP 调用加载本地化，因为我希望语言是动态的和可管理的，而不是随应用程序一起提供。

我使用 SSR 示例和我自己的一些实现做了一些工作。但是在初始渲染时，语言不会加载。当更改路由客户端时，事情正在更新。

i18n.js

路由器 - router.beforeEach

存储操作 - 获取语言环境

结果： i18nrouter.beforeEach在它应该在之后初始化的地方初始化router.beforeEach。

Github问题链接

如何在 swiper 事件中获取在 vue 中声明的方法？

现在我用

但我认为，这不是好方法

我想从我的 node_modules 文件夹中需要 .vue 文件，但似乎 webpack 和 | 或者 .vue 加载器不会转换这些文件。

这是我现在的配置：

我试图设置

但没有成功。

我总是收到错误：

如何配置 webpack 来转换 node_modules 文件夹中的文件？

我正在使用 webpack@3.8.1