Skip to content

Commit

Permalink
Upgrade to Prettier 1.9.1 (#3146)
Browse files Browse the repository at this point in the history
* Upgrade to Prettier 1.9.1

* Switch to formatting markdown with semis so weirdly put semis at front of fragments
  • Loading branch information
KyleAMathews authored Dec 6, 2017
1 parent 38a865f commit dcfa0fa
Show file tree
Hide file tree
Showing 119 changed files with 668 additions and 749 deletions.
4 changes: 2 additions & 2 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -529,7 +529,7 @@ export const pageQuery = `
}
}
}
`
`;
```

You must now write:
Expand All @@ -545,7 +545,7 @@ export const pageQuery = graphql`
}
}
}
`
`;
```

## [1.0.0-alpha10] - 2016-11-17
Expand Down
3 changes: 1 addition & 2 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -33,8 +33,7 @@ The usual contributing steps are:
* Run `npm run watch` from the root of the repo to first do an initial Babel
build of all packages and then watch for changes to packages' source code and
compile these changes on-the-fly as you work.
* Install [gatsby-dev-cli](/packages/gatsby-dev-cli/) globally: `yarn global add
gatsby-dev-cli`
* Install [gatsby-dev-cli](/packages/gatsby-dev-cli/) globally: `yarn global add gatsby-dev-cli`
* For each of your Gatsby test sites, run the `gatsby-dev` command there to copy
the built files from your cloned copy of Gatsby. It'll watch for your changes
to Gatsby packages and copy them into the site. For more detailed instructions
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -165,8 +165,8 @@ navigate around, Gatsby loads the JavaScript needed for each route.
This means that one page with heavy imports:

```javascript
import d3 from "d3"
import threejs from "react-threejs"
import d3 from "d3";
import threejs from "react-threejs";
```

...won't affect the performance of the rest of the site.
Expand All @@ -185,8 +185,8 @@ along with a modern css-in-js library
uses [Redux](http://redux.js.org/) to communicate with their Django API.

The marketing portion of the site loads quickly with minimal JavaScript. When a
potential customer goes to sign-up for the app, there's no *awkward jump from
the marketing website to the web app*—just a simple page change which seamlessly
potential customer goes to sign-up for the app, there's no _awkward jump from
the marketing website to the web app_—just a simple page change which seamlessly
loads in the needed JavaScript. The _team is sharing components and styles
across the site_ without stepping on each others shoes as they rapidly iterate
on features.
Expand Down Expand Up @@ -281,23 +281,23 @@ the blog posts. Included with the component is an exported `pageQuery`.

```javascript
// A simple React component for rendering a blog page.
import React from "react"
import React from "react";

class BlogPostTemplate extends React.Component {
render() {
;<div>
<div>
<h1>{this.props.data.markdown.frontmatter.title}</h1>
<small>{this.props.data.markdown.frontmatter.date}</small>
<div
dangerouslySetInnerHTML={{
__html: this.props.data.markdown.html,
}}
/>
</div>
</div>;
}
}

export default BlogPostTemplate
export default BlogPostTemplate;

export const pageQuery = `
query BlogPost($slug: String!) {
Expand All @@ -311,7 +311,7 @@ export const pageQuery = `
}
}
}
`
`;
```

All data parsing and processing is plugin-driven. So in time, any imaginable
Expand Down
36 changes: 17 additions & 19 deletions docs/blog/2017-07-19-creating-a-blog-with-gatsby/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,7 @@ project), `gatsby develop` (launch a hot-reload enabled web development server),
etc.

We can now begin the exciting task of _actually_ developing on the site, and
creating a functional, modern blog. You'll generally want to use `gatsby
develop` to launch the local development server to validate functionality as we
creating a functional, modern blog. You'll generally want to use `gatsby develop` to launch the local development server to validate functionality as we
progress through the steps.

## Adding necessary plugins
Expand Down Expand Up @@ -87,8 +86,7 @@ with the following command:
yarn add gatsby-plugin-catch-links gatsby-plugin-react-helmet
```

We're using [yarn][yarn], but npm can just as easily be used with `npm i --save
[deps]`.
We're using [yarn][yarn], but npm can just as easily be used with `npm i --save [deps]`.

After installing each of these functional plugins, we'll edit
`gatsby-config.js`, which Gatsby loads at build-time to implement the exposed
Expand Down Expand Up @@ -257,15 +255,15 @@ We'll want to create the file `src/templates/blog-post.js` (please create the
`src/templates` folder if it does not yet exist!).

```javascript
import React from "react"
import Helmet from "react-helmet"
import React from "react";
import Helmet from "react-helmet";

// import '../css/blog-post.css'; // make it pretty!

export default function Template({
data, // this prop will be injected by the GraphQL query we'll write in a bit
}) {
const { markdownRemark: post } = data // data.markdownRemark holds our post data
const { markdownRemark: post } = data; // data.markdownRemark holds our post data
return (
<div className="blog-post-container">
<Helmet title={`Your Blog Name - ${post.frontmatter.title}`} />
Expand All @@ -277,7 +275,7 @@ export default function Template({
/>
</div>
</div>
)
);
}
```

Expand Down Expand Up @@ -379,13 +377,13 @@ Gatsby, as detailed in its [Node API specification][node-spec]. However, we only
care about one particular API in this instance, `createPages`.

```javascript
const path = require("path")
const path = require("path");

exports.createPages = ({ boundActionCreators, graphql }) => {
const { createPage } = boundActionCreators
const { createPage } = boundActionCreators;

const blogPostTemplate = path.resolve(`src/templates/blog-post.js`)
}
const blogPostTemplate = path.resolve(`src/templates/blog-post.js`);
};
```

Nothing super complex yet! We're using the `createPages` API (which Gatsby will
Expand Down Expand Up @@ -543,14 +541,14 @@ create `src/pages/tags.js`, the path `http://localhost:8000/tags/` will be
available within the browser and the statically generated site.

```javascript
import React from "react"
import Link from "gatsby-link"
import Helmet from "react-helmet"
import React from "react";
import Link from "gatsby-link";
import Helmet from "react-helmet";

// import '../css/index.css'; // add some style if you want!

export default function Index({ data }) {
const { edges: posts } = data.allMarkdownRemark
const { edges: posts } = data.allMarkdownRemark;
return (
<div className="blog-posts">
{posts
Expand All @@ -564,10 +562,10 @@ export default function Index({ data }) {
<h2>{post.frontmatter.date}</h2>
<p>{post.excerpt}</p>
</div>
)
);
})}
</div>
)
);
}

export const pageQuery = graphql`
Expand All @@ -586,7 +584,7 @@ export const pageQuery = graphql`
}
}
}
`
`;
```

OK! So we've followed a similar approach to our blog post template, so this
Expand Down
Loading

0 comments on commit dcfa0fa

Please sign in to comment.