reactjs - Aws-Amplify:manifest.json 和 env.json 加载 index.html

Question

我正在构建的 React 应用程序有一个 manifest.json 和一个 env.json，如下所示，

但是，当我使用 AWS-Amplify 将网站发布到 S3 存储桶时，manifest.json 和 env.json 会加载我的 index.html。一切都在本地主机上正常工作，但在生产中我们遇到了以前的问题，即使我们可以获得其他文件作为图标和 robot.txt。

我们公用文件夹的内容是下一个:

asset-manifest.json
browserconfig.xml
ec4c4f981671b5dee24ab5f541f07720.png
ef7c6637c68f269a882e73bcb57a7f6a.woff2
env.json <----- loading index.html
icons
index.html
main-5fbcf0b95e5bf6891f54.js
main-5fbcf0b95e5bf6891f54.js.LICENSE.txt
manifest.json. <----- loading index.html
robots.txt.   <------ working
service-worker.js

amplify.yml 文件如下所示:

 version: 0.1
frontend:
  phases:
    preBuild:
      commands:
        - npm install
    build:
      commands:
        - NODE_ENV=$MY_ENV_SELECTOR node ./node_modules/webpack/bin/webpack.js --mode production --env=prod 
  artifacts:
    baseDirectory: dist
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

看起来它正在为我们提供 index.html，因为它没有找到请求的文件，但我们不知道为什么会这样。

我们希望任何人都可以帮助我们解决这个问题。

Answer 1

我可能已经找到了答案，为我工作。

所以我正在使用 React 和 React-router 构建一个单页应用程序 (SPA)。

我不得不加入一个重定向规则来管理路由器的工作方式。根据放大文档。

Source address: </^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|ttf)$)([^.]+$)/>
Target address: /index.html
Type: 200 (Rewrite)

似乎这也是将 manifest.json 的请求推送到 index.html

我通过向我的放大控制台添加另一条规则解决了这个问题:

Source address: /manifest.json
Target address: /manifest.json  
Type: 200 (Rewrite)

有兴趣知道这是否适用于其他人。