如何使Nuxt在AWS S3托管的dist中生成静态spa文件

Question

如何在AWS S3中托管Nuxt静态web应用？

首先，我尝试并知道如何通过调用nuxt generate在./dist中生成静态SPA文件。

其次，AWS S3支持静态web托管，但似乎必须通过访问该桶中的“index.html”来访问该站点。

因此，我遇到了这个问题，例如，我有一个桶'demo2020'，我将Nuxt/Vue文件上传到./dist中。我还公开设置了桶和文件。之后，我可以访问demo2020桶中的图像，但是不能访问index.html，即http://demo2020.s3-us-west-1.amazonaws.com/index.html。

返回了一个错误页面200.html，它说：

找不到此页面

回到主页

这通常适用于标准的web服务器，例如nginx或http- server /express等，但在AWS S3上还没有成功。

更新:2020年5月6日

这不是aws s3的问题，在本地主机上，如果index.html来自nuxt，相同的错误页面。因此，对于nuxt来说，似乎有些配置不正确。

Answer 1

在使用2.12.2版本时，我也会遇到同样的问题。降级到2.11.0为我解决了这个问题。

Answer 2

作为静态宿主的AWS S3的url需要附加特定的索引文件，即index.html。

路由器需要调整，Nuxt通过使用“路由器：{}”直接为vue-路由器提供设置配置。

下面的配置适用于此场景。

// in nuxt.config.js
mode: 'spa',
router: {
  mode: 'hash',
},