/* eslint  react/prop-types: 0 */
import React from "react";

module.exports = class HTML extends React.Component {
  render() {
    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" />
          {this.props.headComponents}
          <meta name="apple-mobile-web-app-capable" content="yes" />
          <meta name="apple-mobile-web-app-status-bar-style" content="#D0E0D8" />
          <meta name="apple-mobile-web-app-title" content="Lazywill" />
          <link rel="apple-touch-icon" href="/icons/apple-icon-57x57.png" sizes="57x57" />
          <link rel="apple-touch-icon" href="/icons/apple-icon-60x60.png" sizes="60x60" />
          <link rel="apple-touch-icon" href="/icons/apple-icon-72x72.png" sizes="72x72" />
          <link rel="apple-touch-icon" href="/icons/apple-icon-76x76.png" sizes="76x76" />
          <link rel="apple-touch-icon" href="/icons/apple-icon-114x114.png" sizes="114x114" />
          <link rel="apple-touch-icon" href="/icons/apple-icon-120x120.png" sizes="120x120" />
          <link rel="apple-touch-icon" href="/icons/apple-icon-144x144.png" sizes="144x144" />
          <link rel="apple-touch-icon" href="/icons/apple-icon-152x152.png" sizes="152x152" />
          <link rel="apple-touch-icon" href="/icons/apple-icon-180x180.png" sizes="180x180" />
          <link rel="icon" type="image/png" sizes="16x16" href="/icons/favicon-16x16.png" />
          <link rel="icon" type="image/png" sizes="32x32" href="/icons/favicon-32x32.png" />
          <link rel="icon" type="image/png" sizes="96x96" href="/icons/favicon-96x96.png" />
        </head>
        <body {...this.props.bodyAttributes}>
          <noscript>You need to enable JavaScript to run this app!</noscript>
          {this.props.preBodyComponents}
          <div key={`body`} id="___gatsby" dangerouslySetInnerHTML={{ __html: this.props.body }} />
          {this.props.postBodyComponents}
        </body>
      </html>
    );
  }
};

@@ -59,74 +59,409 @@
 %22;%0A%0A
-module.exports = class HTML extends React.Component %7B%0A  render() %7B
+let stylesStr;%0Aif (process.env.NODE_ENV === %60production%60) %7B%0A  try %7B%0A    stylesStr = require(%60!raw-loader!../public/styles.css%60);%0A  %7D catch (e) %7B%0A    console.log(e);%0A  %7D%0A%7D%0A%0Amodule.exports = class HTML extends React.Component %7B%0A  render() %7B%0A    let css;%0A    if (process.env.NODE_ENV === %60production%60) %7B%0A      css = %3Cstyle id=%22gatsby-inlined-css%22 dangerouslySetInnerHTML=%7B%7B __html: stylesStr %7D%7D /%3E;%0A    %7D
 %0A   
@@ -740,32 +740,48 @@
 headComponents%7D%0A
+          %7Bcss%7D%0A
           %3Cmeta 

Add CSS rendering to html.js