Question

首次加载页面时，总是会出现以下错误：Refused to execute script from '<URL>' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.结果是我的很多JavaScript根本无法正常工作。如果我重新加载页面，则效果很好。这仅在通过Netlify生产时发生。我的本地环境每次都能完美运行，没有控制台错误或警告。

出现错误时，这里是dom：

这是在一切正常加载后第二次加载的dom：

最后，这是我的html.js文件：

let stylesStr
if (process.env.NODE_ENV === `production`) {
  try {
    stylesStr = require(`!raw-loader!../public/styles.css`)
  } catch (e) {
    console.log(e)
  }
}

module.exports = class HTML extends React.Component {
  render() {
    let css
    if (process.env.NODE_ENV === `production`) {
      css = (
        <style
          id="gatsby-inlined-css"
          dangerouslySetInnerHTML={{ __html: stylesStr }}
        />
      )
    }
    return (
      <html {...this.props.htmlAttributes}>
        <head>
          <meta charSet="utf-8" />
          <meta httpEquiv="x-ua-compatible" content="ie=edge" />
          <meta
            name="viewport"
            content="width=device-width, initial-scale=1, shrink-to-fit=no"
          />
          <link rel="shortcut icon" href={favicon} />
          {this.props.headComponents}
          {css}
        </head>
        <body {...this.props.bodyAttributes}>
          {this.props.preBodyComponents}
          <div
            key={`body`}
            id="___gatsby"
            dangerouslySetInnerHTML={{ __html: this.props.body }}
          />
          {this.props.postBodyComponents}
          <script
            type="text/javascript"
            dangerouslySetInnerHTML={{
              __html: `
                ...some javascript code
              `
            }}
          />
        </body>
      </html>
    )
  }
}

我尝试在gatsby-config.js文件中设置类型，但不能解决问题。

resolve: `gatsby-plugin-netlify`,
        options: {
          headers: {
            "/*.js": [
              "Cache-Control: public, max-age=0, must-revalidate",
              "Content-Type: text/javascript"
            ],
          },
        },
      },

找出解决方法：

{
      resolve: `gatsby-plugin-netlify`,
      options: {
        mergeLinkHeaders: false,
        mergeCachingHeaders: false
      },
    },

Gatsby javascript文件不会在首次加载时加载，仅在刷新时加载； MIME-TYPE错误

0 个答案: