import React, { Component, PropTypes } from 'react'
import Helmet from 'react-helmet'

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

export default class HTML extends Component {
    render () {
        const head = Helmet.rewind()
        let css
        if (process.env.NODE_ENV === `production`) {
            css = <style id="gatsby-inlined-css" dangerouslySetInnerHTML={{ __html: stylesStr }} />
        }

        return (
            <html lang="en">
                <head>
                    <meta charSet="utf-8" />
                    <meta httpEquiv="X-UA-Compatible" content="IE=edge" />
                    <meta
                        name="viewport"
                        content="width=device-width, initial-scale=1.0"
                        />
                    {this.props.headComponents}
                    {css}
                    {head.title.toComponent()}
                    {head.meta.toComponent()}
                    {head.link.toComponent()}
                </head>
                <body>
                    <div id="react-mount" dangerouslySetInnerHTML={{ __html: this.props.body }} />
                    {this.props.postBodyComponents}
                </body>
            </html>
        )
    }
}

@@ -84,26 +84,79 @@
 t'%0A%0A
-let stylesStr%0Aif (
+import %7B default as Icon %7D from 'pages/icon.png'%0A%0Aconst isProduction = 
 proc
@@ -168,33 +168,33 @@
 nv.NODE_ENV === 
-%60
+'
 production%60) %7B%0A 
@@ -179,33 +179,65 @@
  === 'production
-%60
+'%0A%0Alet stylesStr%0Aif (isProduction
 ) %7B%0A    try %7B%0A  
@@ -459,86 +459,34 @@
     
-le
+cons
 t css
-%0A        if (process.env.NODE_ENV === %60production%60) %7B%0A            css =
+ = isProduction ?
  %3Cst
@@ -567,18 +567,15 @@
 %7D /%3E
-%0A        %7D
+ : null
 %0A%0A  

Update handling of node env in html.js