找不到page.data.json 404和未在生产中触发componentDidMount（）

Question

我有一个GatsbyJS网站，遇到的一个问题是它找不到任何页面数据文件，也没有componentDidMount（）触发。这仅在生产中发生，在完整版本和gatsby develop中在本地都可以正常工作。

复制步骤

这是我为此创建的演示页面：https://gwhitworth-dev.azurewebsites.net/blog/2019/06/demo/

注意事项

• 有一个错误指出：Failed to load resource: the server responded with a status of 404 (Not Found) https://gwhitworth-dev.azurewebsites.net/page-data/blog/2019/06/demo/page-data.json
• componentDidMount()不会在本地执行的生产环境中触发，因此最终我认为这是问题所在，但不知道是否与page-data.json相关

预期结果

图表应像在本地一样在生产中呈现

实际结果

如果打开上面的链接，您会看到虽然在本地呈现，但没有呈现Highchart。

预先感谢您的帮助。

Answer 1

所以这里的问题是Gatsby期望JSON内容将以application/json的哑剧类型出现：

const isJson = contentType && contentType.startsWith(`application/json`) 

我的服务器未配置为执行此操作，因此它发送的MIME类型为text/html的json文件，这导致页面数据未加载，因此页面内的组件未呈现。为了解决这个问题，我将其添加到了web.config文件中（我在Azure上，我知道这不会通用）：

<staticContent>
      <mimeMap fileExtension=".json" mimeType="application/json" />
    </staticContent>