Manifest.json 意外令牌答案

【问题标题】：Manifest.json Unexpected TokenManifest.json 意外令牌
【发布时间】：2019-08-06 05:35:50
【问题描述】：

您好，我将 react/express 项目推送到 heroku (https://polar-oasis-57801.herokuapp.com/) 并在控制台中收到以下错误： Chrome console error messages

我尝试查找此错误，似乎我需要更改 manifest.json 文件中的某些内容，但我不确定。任何建议都会有所帮助。这是我的清单文件：

{
  "short_name": "React App",
  "name": "Create React App Sample",
  "icons": [
    {
      "src": "favicon.ico",
      "sizes": "64x64 32x32 24x24 16x16",
      "type": "image/x-icon"
    }
  ],
  "start_url": ".",
  "display": "standalone",
  "theme_color": "#000000",
  "background_color": "#ffffff"
}

还有我在 Github 上的项目：https://github.com/bernar83/cat-cards

【问题讨论】：

通常这样的错误意味着解析的 JSON 不是有效的 JSON。快速检查您链接的文件似乎表明它是有效的 JSON。 manifest.json 是否可能在部署过程中以某种方式更改？
"Unexpected token <" 通常意味着您正在尝试解析 HTML 而不是 JSON。查看服务器为polar-oasis-57801.herokuapp.com/cat-cards/manifest.json 返回的数据，您可以看到这正是正在发生的事情。服务器返回的是 HTML 文档，而不是您的 JSON 文件。（它对你的 .js 和 .css 文件做同样的事情。）
我刚刚遇到同样的错误，几个小时后我修复了它，将manifest.json 中的start_url 更改为"start_url": "./index.html",

标签： javascript node.js reactjs express manifest.json

【解决方案1】：

此错误表示对manifest.json 的请求未返回有效的 JSON 响应。它可能会返回一个 HTML，因为它由于起始 < 而失败。

确保正确链接manifest.json，并确保在部署过程中保持其完整性。尝试导航到http://yoururl/manifest.json 并检查结果。

EDIT1：您的清单链接似乎已损坏。在 https://github.com/bernar83/cat-cards/blob/master/client/public/index.html 中，尝试替换

<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

与

<link rel="manifest" href="manifest.json" />

EDIT2：刚刚检查了您的 Heroku 链接并可以确认错误。您的页面试图在路径/cat-cards/manifest.json 下找到manifest.json，这是错误的。应该只是manifest.json

【讨论】：

我将链接更改为 manifest.json 并删除了有关清单文件的错误消息，但现在在我最近部署的 heroku 站点中查看控制台，我仍然得到这张图片中的前两个错误： i.stack.imgur.com/ZyMuL.png。关于如何删除未捕获的语法错误的任何想法？
您还必须修复指向您的 javascript 文件的链接
我不确定我是否在正确的地方寻找，但你能澄清我在哪里可以找到这些 javascript 链接吗？我假设它在清单链接所在的 client/build/index.html 文件中，但我无法在其中找到 javascript 链接。
实际上从package.json 中删除homepage 修复它。
@Roshdy 你的解决方案对我有用，谢谢。

【解决方案2】：

我在我的 server.js 文件中添加了这个更改 "/cat-cards/"，所以现在它是 app.use("/cat-cards/", express.static("client/build"));。添加该更改并推送到 Heroku 使我的网站正常运行。这对我有帮助：https://github.com/facebook/create-react-app/issues/1812#issuecomment-286511320

【讨论】：

【解决方案3】：

我遇到了类似的问题。我会添加它，因为这是我在试图弄清楚它时最终看到的 SO 帖子。我将一些生成的 favicon 标记包含到我的“JS not allowed”文件中。我的 manifest.json 位于我的 src/ 目录中，因此粘贴的标记引用了不在我的公共根目录中的清单。然后，样板代码返回“此处不允许 JS”EJS HTML 作为 manifest.json 的实际返回值，因此浏览器将其视为格式错误的 JSON...不理想。

所以，如果您的路由器会像 Ant Design Pro 那样针对错误的 HTTP 请求返回这种东西，那可能是您的问题。

【讨论】：

【解决方案4】：

是的，我遇到了这个问题并为此苦苦挣扎，然后我按照这对我有帮助：https://github.com/facebook/create-react-app/issues/1812#issuecomment-286511320 链接。它绝对有效。我感谢分享此链接的人。

【讨论】：

欢迎来到 Stack Overflow！虽然此链接可能会回答问题，但最好在此处包含一些上下文和答案的基本部分，然后提供链接以供参考。当链接页面更改或脱机时，仅链接答案将失效。有关更多信息，请参阅How do I write a good answer?。

【解决方案5】：

我遇到了同样的问题，我通过以下方式解决了它：

在你的 react 应用中进入 package.json 文件。
您将在顶部看到主页属性，将其删除或复制该 URL。

如果您将其删除，则再次创建构建并在您的 express.static('./build') 中使用该构建。
如果您复制它，则在您的快速服务器文件中使用 app.use("that copied url" , express.static('./build')) 中的该 URL。

【讨论】：

【解决方案6】：

检查 build 和公共文件夹中的 index.html。我有同样的问题，只是发现问题与 Html 无关。

谢谢比诺德·辛格

【讨论】：

【解决方案7】：

今天遇到了这个问题。我的团队的问题是在 server.js 文件中，app.use(routes) 线在静态资产之上 app.use(express.static("client/build"))

将其移到下方允许站点适当地部署到 heroku。

【讨论】：