Question

我正试图通过添加 manifest.json 来使现有的react应用程序逐步发展。

但是，当我收到上述错误消息时，似乎我的应用程序无法找到我的 manifest.json 文件，而当我收到一个无法获取/manifest.json 时，查看开发人员工具的“网络”标签。这很奇怪，因为我的 manifest.json 位于我的应用程序的根目录下，该错误恰恰在该位置指出无法找到文件。

我尝试了几种方法，例如在每个目录中放置一个 manifest.json 文件，或者在我的webpack配置中引入了json-loader，但无济于事。

我在哪里引用清单

<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="manifest" href="/manifest.json" >
  </head>
  <body>
    <div id="root" class="body"></div>
  </body>
</html>

此外，我使用的是 webpack-manifest-plugin ，它在构建目录中创建了一个 asset-manifest.json 文件，该文件映射了我的索引文件。

webpack.config

//...
const ManifestPlugin = require("webpack-manifest-plugin")
module.exports = {
    plugins: [
        new ManifestPlugin({
            fileName: "asset-manifest.json"
        })
        //...

创建了asset-manifest.json

{
  "index.js": "index.bundle.js",
  "index.html": "index.html"
}

希望你能帮助我

Answer 1

问题不仅仅与manifest.json有关，而且与所有json文件有关。如此处所说：https://stackoverflow.com/a/29633038/3231884，您需要根据以下示例设置web.config：

<?xml version="1.0"?>
<configuration>
    <system.webServer>
        <staticContent>
        <remove fileExtension=".json" />
        <mimeMap fileExtension=".json" mimeType="application/json" />
      </staticContent>
    </system.webServer>
</configuration>

然后，您应按照以下步骤（通过Liviu Costea贷记）使“ npm run build”将其复制到build文件夹： https://medium.com/hackernoon/adding-web-config-to-react-projects-3eb762dbe01f

Answer 2

这应该是manifest.json文件的问题。请显示manifest.json文件的内容。

在manifest.json中尝试一下 name属性应使用小写字母且不能包含空格。

Answer 3

更改扩展清单从 manifest.json 到 manifest.txt

jsreact-GET http：// localhost：8080 / manifest.json 404（未找到）

3 个答案: