Question

我的网站在台式机上运行良好，但在移动设备（iOS / Android）上显示空白页。这是Firebase托管的create-react-app。

firebase.json

{
  "hosting": {
    "public": "build",
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

manifest.json

{
  "short_name": "DevShare",
  "name": "DevShare",
  "icons": [
    {
      "src": "favicon.ico",
      "sizes": "64x64 32x32 24x24 16x16",
      "type": "image/x-icon"
    }
  ],
  "start_url": "/",
  "display": "standalone",
  "theme_color": "#212C3D",
  "background_color": "#212C3D"
}

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <meta name="theme-color" content="#212C3D" />
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
    <link
      rel="stylesheet"
      href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
      integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
      crossorigin="anonymous"
    />
    <link
      rel="stylesheet"
      href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"
    />
    <title>DevShare</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
  </body>
</html>

我认为该问题与 manifest.json 有关，因为它仅与移动网站有关。我尝试过：

在manifest.json中：

将start_url更改为“ /”、“/index.html”和“ ./index.html”

在firebase.json中：

将公用文件夹更改为“ ./build”和“ build”（由npm run build生成）

在index.html中：

删除 manifest.json 导入

为 service-worker.js （recommended by create-react-app）

设置HTTP缓存标头

我还在 index.js 中取消了服务工作者的注册，但是我之前已经进行过注册。

我在做什么错？谢谢！

GitHub Repo

Answer 1

原来是一个 redux devtools扩展问题。

我正在这样创建商店：

rivaldo4t@Rivaldo-OS3:~$ python -c 'import sys; print(sys.path)'
['', '/home/rivaldo4t', '/usr/bin/caffe/python', '/usr/lib/python2.7', '/usr/lib/python2.7/plat-x86_64-linux-gnu', '/usr/lib/python2.7/lib-tk', '/usr/lib/python2.7/lib-old', '/usr/lib/python2.7/lib-dynload', '/home/rivaldo4t/.local/lib/python2.7/site-packages', '/usr/local/lib/python2.7/dist-packages', '/usr/lib/python2.7/dist-packages']

但这可行：

createStore(
  rootReducer,
  compose(
    /* other stuff... */
    window.__REDUX_DEVTOOLS_EXTENSION__ &&  window.__REDUX_DEVTOOLS_EXTENSION__()
  )
);

由Firebase托管的我的网站中移动设备上的空白页

1 个答案: