Update dependencies, use .js file extensions
This commit is contained in:
parent
4d3c5ca244
commit
65431b45bb
7 changed files with 28 additions and 21 deletions
|
|
@ -3,3 +3,6 @@ Gatsby starter for creating a blog
|
||||||
|
|
||||||
Install this starter (assuming Gatsby is installed) by running from your CLI:
|
Install this starter (assuming Gatsby is installed) by running from your CLI:
|
||||||
`gatsby new gatsby-blog https://github.com/gatsbyjs/gatsby-starter-blog`
|
`gatsby new gatsby-blog https://github.com/gatsbyjs/gatsby-starter-blog`
|
||||||
|
|
||||||
|
## Running in development
|
||||||
|
`gatsby develop`
|
||||||
|
|
|
||||||
|
|
@ -6,17 +6,18 @@ import { rhythm, fontSizeToMS } from 'utils/typography'
|
||||||
|
|
||||||
class ReadNext extends React.Component {
|
class ReadNext extends React.Component {
|
||||||
render () {
|
render () {
|
||||||
const readNext = this.props.post.readNext
|
const { pages, post } = this.props
|
||||||
|
const { readNext } = post
|
||||||
let nextPost
|
let nextPost
|
||||||
if (readNext) {
|
if (readNext) {
|
||||||
nextPost = find(this.props.pages, (page) =>
|
nextPost = find(pages, (page) =>
|
||||||
includes(page.path, readNext)
|
includes(page.path, readNext)
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
if (!nextPost) {
|
if (!nextPost) {
|
||||||
return React.createElement('noscript', null)
|
return React.createElement('noscript', null)
|
||||||
} else {
|
} else {
|
||||||
nextPost = find(this.props.pages, (page) =>
|
nextPost = find(pages, (page) =>
|
||||||
includes(page.path, readNext.slice(1, -1))
|
includes(page.path, readNext.slice(1, -1))
|
||||||
)
|
)
|
||||||
// Create pruned version of the body.
|
// Create pruned version of the body.
|
||||||
|
|
@ -4,14 +4,8 @@ import { link } from 'gatsby-helpers'
|
||||||
import { TypographyStyle } from 'utils/typography'
|
import { TypographyStyle } from 'utils/typography'
|
||||||
|
|
||||||
export default class Html extends React.Component {
|
export default class Html extends React.Component {
|
||||||
propTypes () {
|
|
||||||
return {
|
|
||||||
body: React.PropTypes.string,
|
|
||||||
favicon: React.PropTypes.string,
|
|
||||||
title: React.PropTypes.string,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
render () {
|
render () {
|
||||||
|
const { favicon, body } = this.props
|
||||||
let title = DocumentTitle.rewind()
|
let title = DocumentTitle.rewind()
|
||||||
if (this.props.title) {
|
if (this.props.title) {
|
||||||
title = this.props.title
|
title = this.props.title
|
||||||
|
|
@ -27,7 +21,7 @@ export default class Html extends React.Component {
|
||||||
content="user-scalable=no width=device-width, initial-scale=1.0 maximum-scale=1.0"
|
content="user-scalable=no width=device-width, initial-scale=1.0 maximum-scale=1.0"
|
||||||
/>
|
/>
|
||||||
<title>{this.props.title}</title>
|
<title>{this.props.title}</title>
|
||||||
<link rel="shortcut icon" href={this.props.favicon}/>
|
<link rel="shortcut icon" href={favicon}/>
|
||||||
<TypographyStyle/>
|
<TypographyStyle/>
|
||||||
<style
|
<style
|
||||||
dangerouslySetInnerHTML={{
|
dangerouslySetInnerHTML={{
|
||||||
|
|
@ -51,7 +45,7 @@ export default class Html extends React.Component {
|
||||||
/>
|
/>
|
||||||
</head>
|
</head>
|
||||||
<body className="landing-page">
|
<body className="landing-page">
|
||||||
<div id="react-mount" dangerouslySetInnerHTML={{ __html: this.props.body }} />
|
<div id="react-mount" dangerouslySetInnerHTML={{ __html: body }} />
|
||||||
<script src={link('/bundle.js')}/>
|
<script src={link('/bundle.js')}/>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -59,4 +53,10 @@ export default class Html extends React.Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Html.propTypes = {
|
||||||
|
body: React.PropTypes.string,
|
||||||
|
favicon: React.PropTypes.string,
|
||||||
|
title: React.PropTypes.string,
|
||||||
|
}
|
||||||
|
|
||||||
Html.defaultProps = { body: '' }
|
Html.defaultProps = { body: '' }
|
||||||
11
package.json
11
package.json
|
|
@ -5,7 +5,8 @@
|
||||||
"main": "n/a",
|
"main": "n/a",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"lint": "./node_modules/.bin/eslint --ext .js,.jsx --ignore-pattern public .",
|
"lint": "./node_modules/.bin/eslint --ext .js,.jsx --ignore-pattern public .",
|
||||||
"test": "echo \"Error: no test specified\" && exit 1"
|
"test": "echo \"Error: no test specified\" && exit 1",
|
||||||
|
"dev": "gatsby develop"
|
||||||
},
|
},
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
|
|
@ -22,21 +23,21 @@
|
||||||
"homepage": "https://github.com/gatsbyjs/gatsby-starter-blog#readme",
|
"homepage": "https://github.com/gatsbyjs/gatsby-starter-blog#readme",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"lodash": "^4.5.0",
|
"lodash": "^4.5.0",
|
||||||
"moment": "^2.10.3",
|
"moment": "^2.11.2",
|
||||||
"react": "^0.14.7",
|
"react": "^0.14.7",
|
||||||
"react-document-title": "^2.0.1",
|
"react-document-title": "^2.0.1",
|
||||||
"react-dom": "^0.14.7",
|
"react-dom": "^0.14.7",
|
||||||
"react-responsive-grid": "^0.3.0",
|
"react-responsive-grid": "^0.3.1",
|
||||||
"react-router": "^2.0.0",
|
"react-router": "^2.0.0",
|
||||||
"safe-access": "^0.1.0",
|
"safe-access": "^0.1.0",
|
||||||
"typography": "^0.7.0",
|
"typography": "^0.7.0",
|
||||||
"underscore.string": "^3.2.2"
|
"underscore.string": "^3.2.3"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"babel-plugin-react-transform": "^1.1.1",
|
"babel-plugin-react-transform": "^1.1.1",
|
||||||
"eslint": "^1.10.3",
|
"eslint": "^1.10.3",
|
||||||
"eslint-config-airbnb": "^5.0.1",
|
"eslint-config-airbnb": "^5.0.1",
|
||||||
"eslint-plugin-react": "^4.0.0",
|
"eslint-plugin-react": "^3.16.1",
|
||||||
"react-transform-catch-errors": "^1.0.0",
|
"react-transform-catch-errors": "^1.0.0",
|
||||||
"react-transform-hmr": "^1.0.0",
|
"react-transform-hmr": "^1.0.0",
|
||||||
"redbox-react": "^1.0.1"
|
"redbox-react": "^1.0.1"
|
||||||
|
|
|
||||||
|
|
@ -9,8 +9,9 @@ import '../css/styles.css'
|
||||||
|
|
||||||
class Template extends React.Component {
|
class Template extends React.Component {
|
||||||
render () {
|
render () {
|
||||||
|
const { location, children } = this.props
|
||||||
let header
|
let header
|
||||||
if (this.props.location.pathname === link('/')) {
|
if (location.pathname === link('/')) {
|
||||||
header = (
|
header = (
|
||||||
<h1
|
<h1
|
||||||
style={{
|
style={{
|
||||||
|
|
@ -53,7 +54,7 @@ class Template extends React.Component {
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{header}
|
{header}
|
||||||
{this.props.children}
|
{children}
|
||||||
</Container>
|
</Container>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
@ -10,7 +10,8 @@ import '../css/zenburn.css'
|
||||||
|
|
||||||
class MarkdownWrapper extends React.Component {
|
class MarkdownWrapper extends React.Component {
|
||||||
render () {
|
render () {
|
||||||
const post = this.props.route.page.data
|
const { route } = this.props
|
||||||
|
const post = route.page.data
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<DocumentTitle title={`${post.title} | ${config.blogTitle}`}>
|
<DocumentTitle title={`${post.title} | ${config.blogTitle}`}>
|
||||||
|
|
@ -30,7 +31,7 @@ class MarkdownWrapper extends React.Component {
|
||||||
marginBottom: rhythm(2),
|
marginBottom: rhythm(2),
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<ReadNext post={post} pages={this.props.route.pages} />
|
<ReadNext post={post} pages={route.pages} />
|
||||||
<p>
|
<p>
|
||||||
<img
|
<img
|
||||||
src={link('/kyle-round-small-pantheon.jpg')}
|
src={link('/kyle-round-small-pantheon.jpg')}
|
||||||
Loading…
Add table
Add a link
Reference in a new issue