Use gatsby-plugin-typography and remove the html.js
This commit is contained in:
parent
8f03c8589e
commit
33ed103d69
5 changed files with 9068 additions and 53 deletions
1
.gitignore
vendored
1
.gitignore
vendored
|
|
@ -4,4 +4,3 @@ public
|
|||
.DS_Store
|
||||
.intermediate-representation/
|
||||
.cache/
|
||||
yarn.lock
|
||||
|
|
|
|||
|
|
@ -43,5 +43,9 @@ module.exports = {
|
|||
},
|
||||
`gatsby-plugin-offline`,
|
||||
`gatsby-plugin-react-helmet`,
|
||||
{
|
||||
resolve: "gatsby-plugin-typography",
|
||||
pathToConfigModule: "src/utils/typography",
|
||||
},
|
||||
],
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@
|
|||
"gatsby-plugin-preact": "^1.0.0",
|
||||
"gatsby-plugin-react-helmet": "^1.0.0",
|
||||
"gatsby-plugin-sharp": "^1.6.0",
|
||||
"gatsby-plugin-typography": "^1.7.2",
|
||||
"gatsby-remark-copy-linked-files": "^1.5.0",
|
||||
"gatsby-remark-images": "^1.5.0",
|
||||
"gatsby-remark-prismjs": "^1.2.0",
|
||||
|
|
@ -25,10 +26,8 @@
|
|||
"gatsby-transformer-sharp": "^1.6.0",
|
||||
"lodash": "^4.15.0",
|
||||
"react-responsive-grid": "^0.3.3",
|
||||
"react-typography": "^0.16.1",
|
||||
"typeface-merriweather": "0.0.25",
|
||||
"typeface-montserrat": "0.0.24",
|
||||
"typography": "^0.16.0",
|
||||
"typography-theme-wordpress-2016": "^0.15.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
|
|
|||
50
src/html.js
50
src/html.js
|
|
@ -1,50 +0,0 @@
|
|||
import React from 'react'
|
||||
import { TypographyStyle } from 'react-typography'
|
||||
|
||||
import typography from './utils/typography'
|
||||
|
||||
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 React.Component {
|
||||
render() {
|
||||
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}
|
||||
<TypographyStyle typography={typography} />
|
||||
{css}
|
||||
</head>
|
||||
<body>
|
||||
<div
|
||||
id="___gatsby"
|
||||
dangerouslySetInnerHTML={{ __html: this.props.body }}
|
||||
/>
|
||||
{this.props.postBodyComponents}
|
||||
</body>
|
||||
</html>
|
||||
)
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue