html - Vue-Nuxt : Why can't I see the generated HTMLs correctly?

Question

因此，当我键入 npm run generate 时，Nuxt 会将我的项目生成到 dist 文件夹中。在该文件夹中，我可以找到一个名为 _nuxt 的文件夹，其中包含 .js 文件和 index.html 文件，但是当我在浏览器它不显示任何内容。

所以，我的问题是:那些不是静态文件吗？

当你使用 CDN served vue.js 时，你有 html 文件，你点击一下，所有内容都会显示在浏览器上，因为那些 .html 文件是静态的，它们不需要内部本地主机服务器。 为什么 npm run generate 不做同样的事情？或者如何查看生成的文件？

Answer 1

作为@aljazerzen解释说，Vue,js 不会开箱即用地执行 SSR，Nuxt.js 的目标之一就是为您提供 SSR ，作为一项好处，您还可以生成网站的静态版本。如果我得到你想要的正确，你想要做的是当你打开你的 index.html(Nuxt.js 为你生成的)你可以看到您的功能性网页。当您以 file:/// url 访问您的网站时，您的浏览器(至少我已经看到它发生在 Chrome 上)不会加载您的 .js 文件。

我手头没有任何 Nuxt 生成的网站，所以我不能告诉你为什么会发生这种情况。但这是我的猜测:当 Nuxt 生成这些文件时，它会为它们提供一个无法作为 file:/// 访问的 src，可能是 /your_js.js，当它尝试加载它时，认为它是根文件夹的 / 而不是相对于您网站的根目录 (/)。

此问题的解决方案是使用任何网络服务器为您的 Assets 提供服务。根据Nuxt.js's documentation :

nuxt generate:构建应用程序并将每个路由生成为 HTML 文件(用于静态托管)。

您可以通过键入以下内容进行快速测试并使用简单的 Web 服务器:

python -m http.server

在包含您生成的 Assets 的文件夹中。

希望这对您有所帮助!