From 60e212f964495747865cc7f942470e46d1f0d7c9 Mon Sep 17 00:00:00 2001 From: Roger Goldfinger Date: Mon, 10 Dec 2018 17:08:48 -0800 Subject: [PATCH 01/33] Fix Starter Library URL and update copy (#10368) Previously the "starter list" linked to a page that wasn't found. This fixes it and updates the copy to reflect the current name. --- docs/docs/recipes.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/recipes.md b/docs/docs/recipes.md index fd17786613b21..6b14dd362b33b 100644 --- a/docs/docs/recipes.md +++ b/docs/docs/recipes.md @@ -41,7 +41,7 @@ Read the [Gatsby project structure](/docs/gatsby-project-structure/) guide for a Starters are boilerplate Gatsby sites maintained officially, or by the community. - Learn how to use the Gatsby CLI tool to use starters in [tutorial part one](/tutorial/part-one/#using-gatsby-starters) -- See a list of [official and community starters](/docs/gatsby-starters/) +- Browse the [Starter Library](/starters/) - Check out Gatsby's [official default starter](https://github.com/gatsbyjs/gatsby-starter-default) ## Creating pages From a3042fdc8a285caa92b3c53d969a14f5197cbd02 Mon Sep 17 00:00:00 2001 From: Michal Piechowiak Date: Tue, 11 Dec 2018 12:25:08 +0100 Subject: [PATCH 02/33] chore(release): Publish - gatsby-image@2.0.23 - gatsby-remark-code-repls@2.0.3 - gatsby-source-contentful@2.0.20 - gatsby-source-drupal@3.0.14 - gatsby-source-filesystem@2.0.12 - gatsby-source-mongodb@2.0.10 - gatsby-source-wordpress@3.0.20 - gatsby@2.0.65 --- packages/gatsby-image/CHANGELOG.md | 8 ++++++++ packages/gatsby-image/package.json | 2 +- packages/gatsby-remark-code-repls/CHANGELOG.md | 6 ++++++ packages/gatsby-remark-code-repls/package.json | 2 +- packages/gatsby-source-contentful/CHANGELOG.md | 6 ++++++ packages/gatsby-source-contentful/package.json | 2 +- packages/gatsby-source-drupal/CHANGELOG.md | 6 ++++++ packages/gatsby-source-drupal/package.json | 4 ++-- packages/gatsby-source-filesystem/CHANGELOG.md | 8 ++++++++ packages/gatsby-source-filesystem/package.json | 2 +- packages/gatsby-source-mongodb/CHANGELOG.md | 6 ++++++ packages/gatsby-source-mongodb/package.json | 2 +- packages/gatsby-source-wordpress/CHANGELOG.md | 6 ++++++ packages/gatsby-source-wordpress/package.json | 4 ++-- packages/gatsby/CHANGELOG.md | 8 ++++++++ packages/gatsby/package.json | 2 +- 16 files changed, 64 insertions(+), 10 deletions(-) diff --git a/packages/gatsby-image/CHANGELOG.md b/packages/gatsby-image/CHANGELOG.md index 78bc97175ad02..554a225a614f1 100644 --- a/packages/gatsby-image/CHANGELOG.md +++ b/packages/gatsby-image/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.23](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image/compare/gatsby-image@2.0.22...gatsby-image@2.0.23) (2018-12-11) + +### Features + +- **gatsby-image:** add onStartLoad prop ([#6702](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image/issues/6702)) ([1d25a95](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image/commit/1d25a95)) + ## [2.0.22](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image/compare/gatsby-image@2.0.21...gatsby-image@2.0.22) (2018-11-29) diff --git a/packages/gatsby-image/package.json b/packages/gatsby-image/package.json index 1058f9bd095b8..5ea983f1f6528 100644 --- a/packages/gatsby-image/package.json +++ b/packages/gatsby-image/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-image", "description": "Lazy-loading React image component with optional support for the blur-up effect.", - "version": "2.0.22", + "version": "2.0.23", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby-remark-code-repls/CHANGELOG.md b/packages/gatsby-remark-code-repls/CHANGELOG.md index 4a492fc519355..025ddf41ba3c3 100644 --- a/packages/gatsby-remark-code-repls/CHANGELOG.md +++ b/packages/gatsby-remark-code-repls/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.3](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-remark-code-repls/compare/gatsby-remark-code-repls@2.0.2...gatsby-remark-code-repls@2.0.3) (2018-12-11) + +**Note:** Version bump only for package gatsby-remark-code-repls + ## [2.0.2](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-remark-code-repls/compare/gatsby-remark-code-repls@2.0.1...gatsby-remark-code-repls@2.0.2) (2018-11-29) diff --git a/packages/gatsby-remark-code-repls/package.json b/packages/gatsby-remark-code-repls/package.json index 3001dbcf0cec3..147e149967b75 100644 --- a/packages/gatsby-remark-code-repls/package.json +++ b/packages/gatsby-remark-code-repls/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-remark-code-repls", "description": "Gatsby plugin to auto-generate links to popular REPLs like Babel and Codepen", - "version": "2.0.2", + "version": "2.0.3", "author": "Brian Vaughn ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby-source-contentful/CHANGELOG.md b/packages/gatsby-source-contentful/CHANGELOG.md index 8179ef1d4d595..76797dda81a51 100644 --- a/packages/gatsby-source-contentful/CHANGELOG.md +++ b/packages/gatsby-source-contentful/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.20](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-contentful/compare/gatsby-source-contentful@2.0.19...gatsby-source-contentful@2.0.20) (2018-12-11) + +**Note:** Version bump only for package gatsby-source-contentful + ## [2.0.19](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-contentful/compare/gatsby-source-contentful@2.0.18...gatsby-source-contentful@2.0.19) (2018-12-07) diff --git a/packages/gatsby-source-contentful/package.json b/packages/gatsby-source-contentful/package.json index d3d1924182dce..b2b5c811cc9ae 100644 --- a/packages/gatsby-source-contentful/package.json +++ b/packages/gatsby-source-contentful/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-source-contentful", "description": "Gatsby source plugin for building websites using the Contentful CMS as a data source", - "version": "2.0.19", + "version": "2.0.20", "author": "Marcus Ericsson (mericsson.com)", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby-source-drupal/CHANGELOG.md b/packages/gatsby-source-drupal/CHANGELOG.md index 2de2889730403..28a35bcb5e291 100644 --- a/packages/gatsby-source-drupal/CHANGELOG.md +++ b/packages/gatsby-source-drupal/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [3.0.14](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-drupal/compare/gatsby-source-drupal@3.0.13...gatsby-source-drupal@3.0.14) (2018-12-11) + +**Note:** Version bump only for package gatsby-source-drupal + ## [3.0.13](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-drupal/compare/gatsby-source-drupal@3.0.12...gatsby-source-drupal@3.0.13) (2018-12-06) diff --git a/packages/gatsby-source-drupal/package.json b/packages/gatsby-source-drupal/package.json index 43027e678d86c..bd011616bcca3 100644 --- a/packages/gatsby-source-drupal/package.json +++ b/packages/gatsby-source-drupal/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-source-drupal", "description": "Gatsby source plugin for building websites using the Drupal CMS as a data source", - "version": "3.0.13", + "version": "3.0.14", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -10,7 +10,7 @@ "@babel/runtime": "^7.0.0", "axios": "^0.18.0", "bluebird": "^3.5.0", - "gatsby-source-filesystem": "^2.0.11", + "gatsby-source-filesystem": "^2.0.12", "lodash": "^4.17.10" }, "devDependencies": { diff --git a/packages/gatsby-source-filesystem/CHANGELOG.md b/packages/gatsby-source-filesystem/CHANGELOG.md index 5c7dc29a163f6..4bd2a03238844 100644 --- a/packages/gatsby-source-filesystem/CHANGELOG.md +++ b/packages/gatsby-source-filesystem/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.12](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-filesystem/compare/gatsby-source-filesystem@2.0.11...gatsby-source-filesystem@2.0.12) (2018-12-11) + +### Features + +- **gatsby-source-filesystem:** keep original name of remote files ([#9777](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-filesystem/issues/9777)) ([dfc069d](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-filesystem/commit/dfc069d)) + ## [2.0.11](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-filesystem/compare/gatsby-source-filesystem@2.0.10...gatsby-source-filesystem@2.0.11) (2018-12-06) diff --git a/packages/gatsby-source-filesystem/package.json b/packages/gatsby-source-filesystem/package.json index f3ac82948b148..222bc72d0a6c0 100644 --- a/packages/gatsby-source-filesystem/package.json +++ b/packages/gatsby-source-filesystem/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-source-filesystem", "description": "Gatsby plugin which parses files within a directory for further parsing by other plugins", - "version": "2.0.11", + "version": "2.0.12", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby-source-mongodb/CHANGELOG.md b/packages/gatsby-source-mongodb/CHANGELOG.md index e6ec58c1e8e57..9cd0b5850b6fd 100644 --- a/packages/gatsby-source-mongodb/CHANGELOG.md +++ b/packages/gatsby-source-mongodb/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.10](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-mongodb/compare/gatsby-source-mongodb@2.0.9...gatsby-source-mongodb@2.0.10) (2018-12-11) + +**Note:** Version bump only for package gatsby-source-mongodb + ## [2.0.9](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-mongodb/compare/gatsby-source-mongodb@2.0.8...gatsby-source-mongodb@2.0.9) (2018-11-29) diff --git a/packages/gatsby-source-mongodb/package.json b/packages/gatsby-source-mongodb/package.json index b0bcae42c3f08..502e89c29fa57 100644 --- a/packages/gatsby-source-mongodb/package.json +++ b/packages/gatsby-source-mongodb/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-source-mongodb", "description": "Source plugin for pulling data into Gatsby from MongoDB collections", - "version": "2.0.9", + "version": "2.0.10", "author": "jhermans85@hotmail.com", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby-source-wordpress/CHANGELOG.md b/packages/gatsby-source-wordpress/CHANGELOG.md index d3a0b8ae54d1a..fc9c8a8d4a5dd 100644 --- a/packages/gatsby-source-wordpress/CHANGELOG.md +++ b/packages/gatsby-source-wordpress/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [3.0.20](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-wordpress/compare/gatsby-source-wordpress@3.0.19...gatsby-source-wordpress@3.0.20) (2018-12-11) + +**Note:** Version bump only for package gatsby-source-wordpress + ## [3.0.19](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-wordpress/compare/gatsby-source-wordpress@3.0.18...gatsby-source-wordpress@3.0.19) (2018-12-06) diff --git a/packages/gatsby-source-wordpress/package.json b/packages/gatsby-source-wordpress/package.json index 931fa7c1cd46c..fa76e4ce08558 100644 --- a/packages/gatsby-source-wordpress/package.json +++ b/packages/gatsby-source-wordpress/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-source-wordpress", "description": "Gatsby source plugin for building websites using the Wordpress CMS as a data source.", - "version": "3.0.19", + "version": "3.0.20", "author": "Sebastien Fichot ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -14,7 +14,7 @@ "bluebird": "^3.5.0", "deep-map": "^1.5.0", "deep-map-keys": "^1.2.0", - "gatsby-source-filesystem": "^2.0.11", + "gatsby-source-filesystem": "^2.0.12", "json-stringify-safe": "^5.0.1", "lodash": "^4.17.10", "minimatch": "^3.0.4", diff --git a/packages/gatsby/CHANGELOG.md b/packages/gatsby/CHANGELOG.md index e799ba3353cca..9293fd361473b 100644 --- a/packages/gatsby/CHANGELOG.md +++ b/packages/gatsby/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.65](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.0.64...gatsby@2.0.65) (2018-12-11) + +### Bug Fixes + +- **gatsby:** fix false type conflict warning on plugin fields ([#10355](https://github.com/gatsbyjs/gatsby/issues/10355)) ([510fb88](https://github.com/gatsbyjs/gatsby/commit/510fb88)) + ## [2.0.64](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.0.63...gatsby@2.0.64) (2018-12-07) diff --git a/packages/gatsby/package.json b/packages/gatsby/package.json index df92197dc9194..48c02418e5ad4 100644 --- a/packages/gatsby/package.json +++ b/packages/gatsby/package.json @@ -1,7 +1,7 @@ { "name": "gatsby", "description": "Blazing fast modern site generator for React", - "version": "2.0.64", + "version": "2.0.65", "author": "Kyle Mathews ", "bin": { "gatsby": "./dist/bin/gatsby.js" From dcbac4494927bb9c7461d8bb4212950d549697c9 Mon Sep 17 00:00:00 2001 From: Michal Piechowiak Date: Tue, 11 Dec 2018 16:06:14 +0100 Subject: [PATCH 03/33] chore(www): bump offline plugin version (#10409) fixes #10151 Issue in `gatsby-plugin-offline` was fixed in #10329, but gatsbyjs.org didn't upgrade. --- www/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/www/package.json b/www/package.json index 5b26496fa9c9a..baa245e83b71f 100644 --- a/www/package.json +++ b/www/package.json @@ -26,7 +26,7 @@ "gatsby-plugin-netlify": "^2.0.0", "gatsby-plugin-netlify-cache": "^0.1.0", "gatsby-plugin-nprogress": "^2.0.5", - "gatsby-plugin-offline": "^2.0.16", + "gatsby-plugin-offline": "^2.0.19", "gatsby-plugin-react-helmet": "^3.0.0", "gatsby-plugin-sharp": "^2.0.5", "gatsby-plugin-sitemap": "^2.0.1", From 02a2e223c1b3e9466f644f49e4a3681f96d76956 Mon Sep 17 00:00:00 2001 From: Lennart Date: Tue, 11 Dec 2018 16:09:08 +0100 Subject: [PATCH 04/33] showcase: Add TMDb Gatsby site (#10411) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit I built [https://tmdb.lekoarts.de/](https://tmdb.lekoarts.de/) for [https://github.com/LekoArts/gatsby-source-tmdb](https://github.com/LekoArts/gatsby-source-tmdb) 👍 --- docs/sites.yml | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/docs/sites.yml b/docs/sites.yml index f4a4274ced001..047c3295d31fd 100644 --- a/docs/sites.yml +++ b/docs/sites.yml @@ -1274,10 +1274,10 @@ - title: LekoArts main_url: "https://www.lekoarts.de" url: "https://www.lekoarts.de" - source_url: "https://github.com/LeKoArts/portfolio" + source_url: "https://github.com/LekoArts/portfolio" featured: false built_by: LekoArts - built_by_url: "https://github.com/LeKoArts" + built_by_url: "https://github.com/LekoArts" description: >- Hi, I'm Lennart — a self-taught and passionate graphic/web designer & frontend developer based in Darmstadt, Germany. I love it to realize complex @@ -3733,3 +3733,16 @@ built_by: Satispay built_by_url: https://www.satispay.com featured: false +- title: The Movie Database - Gatsby + url: https://tmdb.lekoarts.de + main_url: https://tmdb.lekoarts.de + source_url: https://github.com/LekoArts/gatsby-source-tmdb-example + categories: + - Open Source + - Entertainment + - Gallery + featured: false + built_by: LekoArts + built_by_url: "https://github.com/LekoArts" + description: > + Source from The Movie Database (TMDb) API (v3) in Gatsby. This example is built with react-spring, React hooks and react-tabs and showcases the gatsby-source-tmdb plugin. It also has some client-only paths and uses gatsby-image. From 0aade74a1862f7be9875e8f3d84eb049de132c10 Mon Sep 17 00:00:00 2001 From: shannonbux <32467162+shannonbux@users.noreply.github.com> Date: Tue, 11 Dec 2018 10:46:06 -0800 Subject: [PATCH 05/33] removing stub articles until they are written --- www/src/data/sidebars/doc-links.yaml | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/www/src/data/sidebars/doc-links.yaml b/www/src/data/sidebars/doc-links.yaml index d9cdce87b864d..d1bb1c07a6a2e 100644 --- a/www/src/data/sidebars/doc-links.yaml +++ b/www/src/data/sidebars/doc-links.yaml @@ -189,20 +189,8 @@ - title: Use cases with Gatsby (including apps) link: /docs/building-apps-with-gatsby/ items: - - title: Client data fetching* - link: /docs/client-data-fetching/ - title: Building a site with authentication link: /docs/building-a-site-with-authentication/ - - title: Building an e-commerce site* - link: /docs/building-an-e-commerce-site/ - - title: Building a site with asynchronous data* - link: /docs/building-a-site-with-asynchronous-data/ - - title: Building a portfolio* - link: /docs/building-a-portfolio/ - - title: Building a blog* - link: /docs/building-a-blog/ - - title: Building an image-heavy site* - link: /docs/building-an-image-heavy-site/ - title: Adding website functionality link: /docs/adding-website-functionality/ items: From ee26f245ec94d31a62c6faab7198ef8a267284af Mon Sep 17 00:00:00 2001 From: Jim Tittsler Date: Wed, 12 Dec 2018 04:54:30 +0900 Subject: [PATCH 06/33] reorder imports in tutorial part 2 (#10296) * reorder imports in tutorial part 2 The `import` statements need to precede the `console.log` to avoid the error: ```Import in body of module; reorder to top import/first``` Either the line numbers of the insertion(s) need to change or simply show desired top of the file. Further fix to issue #6897 * Highlight changed lines in snippet * chore: update and run lint --- docs/tutorial/part-two/index.md | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/docs/tutorial/part-two/index.md b/docs/tutorial/part-two/index.md index 0ccd7d897ec18..cec992ae02861 100644 --- a/docs/tutorial/part-two/index.md +++ b/docs/tutorial/part-two/index.md @@ -413,14 +413,20 @@ Paste the following into the file: } ``` -Now import that file into the `about-css-modules.js` page you created earlier, by adding the following on lines 2 and 3. -(The `console.log(styles)` code logs the resulting import so you can see what the processed file looks like). +Now import that file into the `about-css-modules.js` page you created earlier, by editing the first few lines +of the file to look like: ```javascript:title=src/pages/about-css-modules.js +import React from "react" +// highlight-next-line import styles from "./about-css-modules.module.css" +import Container from "../components/container" + +// highlight-next-line console.log(styles) ``` +The `console.log(styles)` code logs the resulting import so you can see what the processed file looks like. If you open the developer console (using e.g. Firefox or Chrome's developer tools) in your browser, you'll see: ![css-modules-console](css-modules-console.png) From c181e5f5a65f876416f7d5363d07f515953bbdd5 Mon Sep 17 00:00:00 2001 From: David Bailey <4248177+davidbailey00@users.noreply.github.com> Date: Tue, 11 Dec 2018 20:05:28 +0000 Subject: [PATCH 07/33] docs(gatsby-plugin-offline): Show how to handle a SW update (#10417) Closes #9087 I also deleted `/docs/add-offline-support/` since it just redirects to `/docs/add-offline-support-with-a-service-worker/` anyway, and hasn't been updated in a while. --- ...d-offline-support-with-a-service-worker.md | 37 +++++++++++++----- docs/docs/add-offline-support.md | 38 ------------------- 2 files changed, 27 insertions(+), 48 deletions(-) delete mode 100644 docs/docs/add-offline-support.md diff --git a/docs/docs/add-offline-support-with-a-service-worker.md b/docs/docs/add-offline-support-with-a-service-worker.md index d441fb10314f0..3ff18ac3a41f0 100644 --- a/docs/docs/add-offline-support-with-a-service-worker.md +++ b/docs/docs/add-offline-support-with-a-service-worker.md @@ -7,7 +7,7 @@ If you've run an [audit with Lighthouse](/docs/audit-with-lighthouse/), you may 1. You can [add a manifest file](/docs/add-a-manifest-file/). Ensure that the manifest plugin is listed _before_ the offline plugin so that the offline plugin can cache the created `manifest.webmanifest`. 2. You can also add offline support, since another requirement for a website to qualify as a PWA is the use of a [service worker](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API). [Gatsby's offline plugin](/packages/gatsby-plugin-offline/) makes a Gatsby site work offline--and makes it more resistant to bad network conditions--by creating a service worker for your site. -### What is a service worker +### What is a service worker? A service worker is a script that your browser runs in the background, separate from a web page, opening the door to features that don't need a web page or user interaction. They increase your site availability in spotty connections, and are essential to making a nice user experience. @@ -27,15 +27,15 @@ Add this plugin to your `gatsby-config.js` ```javascript:title=gatsby-config.js { - plugins: [ - { - resolve: `gatsby-plugin-manifest`, - options: { - ... - } - }, - 'gatsby-plugin-offline' - ] + plugins: [ + { + resolve: `gatsby-plugin-manifest`, + options: { + ... + } + }, + 'gatsby-plugin-offline' + ] } ``` @@ -43,6 +43,23 @@ That's all you need to add offline support to your Gatsby site. Note: Service worker registers only in production builds (`gatsby build`). +### Displaying a message when a service worker updates + +To display a custom message once your service worker finds an update, you can use the [`onServiceWorkerUpdateFound`](/docs/browser-apis/#onServiceWorkerUpdateFound) browser API in your `gatsby-browser.js` file. The following code will display a prompt asking the user whether they would like to refresh the page when an update is found: + +```javascript:title=gatsby-browser.js +exports.onServiceWorkerUpdateFound = () => { + const answer = window.prompt( + `This application has been updated. ` + + `Reload to display the latest version?` + ) + + if (answer === true) { + window.reload() + } +} +``` + ## References - [Service Workers: an Introduction](https://developers.google.com/web/fundamentals/primers/service-workers/) diff --git a/docs/docs/add-offline-support.md b/docs/docs/add-offline-support.md deleted file mode 100644 index baa5d3608e3e9..0000000000000 --- a/docs/docs/add-offline-support.md +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: Add offline support ---- - -If you've run an [audit with Lighthouse](/docs/audit-with-lighthouse/), you may have noticed a lackluster score in the "Progressive Web App" category. Let's address how you can improve that score. - -1. You can [add a manifest file](/docs/add-a-manifest-file/). -2. You can also add offline support, since another requirement for a website to qualify as a PWA is the use of a [service worker](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API). A service worker runs in the background, deciding to serve network or cached content based on connectivity, allowing for a seamless, managed offline experience. - -[Gatsby's offline plugin](/packages/gatsby-plugin-offline/) makes a Gatsby site work offline--and makes it more resistant to bad network conditions--by creating a service worker for your site. - -### Using `gatsby-plugin-offline` - -1. Install the plugin: - -```bash -npm install --save gatsby-plugin-offline -``` - -2. Add the plugin to the `plugins` array in your `gatsby-config.js` file. - -```javascript:title=gatsby-config.js -{ - plugins: [ - { - resolve: `gatsby-plugin-manifest`, - options: { - ... - } - }, - 'gatsby-plugin-offline' - ] -} -``` - -That's all you need to get started with service workers with Gatsby. - -> 💡 If you are also [adding a manifest file](/docs/add-a-manifest-file/), the manifest plugin should be listed _before_ the offline plugin so that the offline plugin can cache the created `manifest.webmanifest`. From 572e3c6b67f39d8216f69528e349910604e9d744 Mon Sep 17 00:00:00 2001 From: Lennart Date: Tue, 11 Dec 2018 21:38:14 +0100 Subject: [PATCH 08/33] docs(gatsby-plugin-manifest): Change "minimal-ui" to "standalone" (#10022) https://developers.google.com/web/fundamentals/web-app-manifest/#display > In order to show the Add to Home Screen Prompt, display must be set to **standalone**. I've always automatically used `standalone` (and it works) but just now realized that the README/docs use the wrong property. --- docs/docs/add-a-manifest-file.md | 4 +++- docs/tutorial/part-eight/index.md | 4 +++- packages/gatsby-plugin-manifest/README.md | 14 ++++++++++---- .../__tests__/__snapshots__/gatsby-node.js.snap | 2 +- .../src/__tests__/gatsby-node.js | 6 +++--- 5 files changed, 20 insertions(+), 10 deletions(-) diff --git a/docs/docs/add-a-manifest-file.md b/docs/docs/add-a-manifest-file.md index f0e250995a585..28b379e96ada1 100644 --- a/docs/docs/add-a-manifest-file.md +++ b/docs/docs/add-a-manifest-file.md @@ -37,7 +37,9 @@ npm install --save gatsby-plugin-manifest start_url: "/", background_color: "#6b37bf", theme_color: "#6b37bf", - display: "minimal-ui", + // Enables "Add to Homescreen" prompt and disables browser UI (including back button) + // see https://developers.google.com/web/fundamentals/web-app-manifest/#display + display: "standalone", icon: "src/images/icon.png", // This path is relative to the root of the site. }, }, diff --git a/docs/tutorial/part-eight/index.md b/docs/tutorial/part-eight/index.md index deceb43d7b0de..4245827364d1b 100644 --- a/docs/tutorial/part-eight/index.md +++ b/docs/tutorial/part-eight/index.md @@ -98,7 +98,9 @@ npm install --save gatsby-plugin-manifest start_url: "/", background_color: "#6b37bf", theme_color: "#6b37bf", - display: "minimal-ui", + // Enables "Add to Homescreen" prompt and disables browser UI (including back button) + // see https://developers.google.com/web/fundamentals/web-app-manifest/#display + display: "standalone", icon: "src/images/icon.png", // This path is relative to the root of the site. }, }, diff --git a/packages/gatsby-plugin-manifest/README.md b/packages/gatsby-plugin-manifest/README.md index a526d42a739a7..b1693b6094849 100644 --- a/packages/gatsby-plugin-manifest/README.md +++ b/packages/gatsby-plugin-manifest/README.md @@ -46,7 +46,9 @@ module.exports = { start_url: `/`, background_color: `#f7f0eb`, theme_color: `#a2466c`, - display: `minimal-ui`, + // Enables "Add to Homescreen" prompt and disables browser UI (including back button) + // see https://developers.google.com/web/fundamentals/web-app-manifest/#display + display: `standalone`, icon: `src/images/icon.png`, // This path is relative to the root of the site. }, }, @@ -118,7 +120,9 @@ module.exports = { start_url: `/`, background_color: `#f7f0eb`, theme_color: `#a2466c`, - display: `minimal-ui`, + // Enables "Add to Homescreen" prompt and disables browser UI (including back button) + // see https://developers.google.com/web/fundamentals/web-app-manifest/#display + display: `standalone`, icon: `src/images/icon.png`, // This path is relative to the root of the site. icons: [ { @@ -155,7 +159,9 @@ module.exports = { start_url: `/`, background_color: `#f7f0eb`, theme_color: `#a2466c`, - display: `minimal-ui`, + // Enables "Add to Homescreen" prompt and disables browser UI (including back button) + // see https://developers.google.com/web/fundamentals/web-app-manifest/#display + display: `standalone`, icons: [ { // Everything in /static will be copied to an equivalent @@ -193,7 +199,7 @@ module.exports = { start_url: `/`, background_color: `#f7f0eb`, theme_color: `#a2466c`, - display: `minimal-ui`, + display: `standalone`, icon: `src/images/icon.png`, // This path is relative to the root of the site. legacy: true, // this will add apple-touch-icon links to }, diff --git a/packages/gatsby-plugin-manifest/src/__tests__/__snapshots__/gatsby-node.js.snap b/packages/gatsby-plugin-manifest/src/__tests__/__snapshots__/gatsby-node.js.snap index 9cc19750c8358..3dbff6ee5d17a 100644 --- a/packages/gatsby-plugin-manifest/src/__tests__/__snapshots__/gatsby-node.js.snap +++ b/packages/gatsby-plugin-manifest/src/__tests__/__snapshots__/gatsby-node.js.snap @@ -1,5 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`Test plugin manifest options correctly works with default parameters 1`] = `"{\\"name\\":\\"GatsbyJS\\",\\"short_name\\":\\"GatsbyJS\\",\\"start_url\\":\\"/\\",\\"background_color\\":\\"#f7f0eb\\",\\"theme_color\\":\\"#a2466c\\",\\"display\\":\\"minimal-ui\\",\\"icons\\":[{\\"src\\":\\"icons/icon-48x48.png\\",\\"sizes\\":\\"48x48\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-72x72.png\\",\\"sizes\\":\\"72x72\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-96x96.png\\",\\"sizes\\":\\"96x96\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-144x144.png\\",\\"sizes\\":\\"144x144\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-192x192.png\\",\\"sizes\\":\\"192x192\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-256x256.png\\",\\"sizes\\":\\"256x256\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-384x384.png\\",\\"sizes\\":\\"384x384\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-512x512.png\\",\\"sizes\\":\\"512x512\\",\\"type\\":\\"image/png\\"}]}"`; +exports[`Test plugin manifest options correctly works with default parameters 1`] = `"{\\"name\\":\\"GatsbyJS\\",\\"short_name\\":\\"GatsbyJS\\",\\"start_url\\":\\"/\\",\\"background_color\\":\\"#f7f0eb\\",\\"theme_color\\":\\"#a2466c\\",\\"display\\":\\"standalone\\",\\"icons\\":[{\\"src\\":\\"icons/icon-48x48.png\\",\\"sizes\\":\\"48x48\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-72x72.png\\",\\"sizes\\":\\"72x72\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-96x96.png\\",\\"sizes\\":\\"96x96\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-144x144.png\\",\\"sizes\\":\\"144x144\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-192x192.png\\",\\"sizes\\":\\"192x192\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-256x256.png\\",\\"sizes\\":\\"256x256\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-384x384.png\\",\\"sizes\\":\\"384x384\\",\\"type\\":\\"image/png\\"},{\\"src\\":\\"icons/icon-512x512.png\\",\\"sizes\\":\\"512x512\\",\\"type\\":\\"image/png\\"}]}"`; exports[`Test plugin manifest options fails on non existing icon 1`] = `"icon (non/existing/path) does not exist as defined in gatsby-config.js. Make sure the file exists relative to the root of the site."`; diff --git a/packages/gatsby-plugin-manifest/src/__tests__/gatsby-node.js b/packages/gatsby-plugin-manifest/src/__tests__/gatsby-node.js index b3ac1c1b66d7d..39a2695968b28 100644 --- a/packages/gatsby-plugin-manifest/src/__tests__/gatsby-node.js +++ b/packages/gatsby-plugin-manifest/src/__tests__/gatsby-node.js @@ -21,7 +21,7 @@ describe(`Test plugin manifest options`, () => { start_url: `/`, background_color: `#f7f0eb`, theme_color: `#a2466c`, - display: `minimal-ui`, + display: `standalone`, }) const [filePath, contents] = fs.writeFileSync.mock.calls[0] expect(filePath).toEqual(path.join(`public`, `manifest.webmanifest`)) @@ -36,7 +36,7 @@ describe(`Test plugin manifest options`, () => { start_url: `/`, background_color: `#f7f0eb`, theme_color: `#a2466c`, - display: `minimal-ui`, + display: `standalone`, icon: `non/existing/path`, icons: [ { @@ -58,7 +58,7 @@ describe(`Test plugin manifest options`, () => { start_url: `/`, background_color: `#f7f0eb`, theme_color: `#a2466c`, - display: `minimal-ui`, + display: `standalone`, icons: [ { src: `icons/icon-48x48.png`, From 768aaa03206ac0b8d50a9d816d7e92ea176d3abc Mon Sep 17 00:00:00 2001 From: Mark Miller Date: Wed, 12 Dec 2018 00:01:25 +0200 Subject: [PATCH 09/33] fix(gatsby-remark-images-contentful): fix image urls with https/http prefix (#7537) This pull request fixes scenario where Contentful markdown which includes images with urls with `https:` prefix were leading to forbidden 403 errors on Gatsby startup. Urls with `http:` prefix will also now render correctly. The default in Contentful is to insert images without `http/https` prefix. --- .../src/__tests__/__snapshots__/index.js.snap | 38 ++++++++++++++++++- .../src/__tests__/index.js | 16 ++++++++ .../src/index.js | 13 +++++-- 3 files changed, 61 insertions(+), 6 deletions(-) diff --git a/packages/gatsby-remark-images-contentful/src/__tests__/__snapshots__/index.js.snap b/packages/gatsby-remark-images-contentful/src/__tests__/__snapshots__/index.js.snap index be1725544eddb..8ce88e806f5ce 100644 --- a/packages/gatsby-remark-images-contentful/src/__tests__/__snapshots__/index.js.snap +++ b/packages/gatsby-remark-images-contentful/src/__tests__/__snapshots__/index.js.snap @@ -2,7 +2,7 @@ exports[`it transforms HTML img tags 1`] = ` " - + @@ -18,7 +18,41 @@ exports[`it transforms images in markdown 1`] = ` " + + + + \\"image\\" + + + + + " +`; + +exports[`it transforms images with a https scheme in markdown 1`] = ` +" + { expect(node.value).not.toMatch(``) }) +test(`it transforms images with a https scheme in markdown`, async () => { + const imagePath = `https://images.ctfassets.net/rocybtov1ozk/wtrHxeu3zEoEce2MokCSi/73dce36715f16e27cf5ff0d2d97d7dff/quwowooybuqbl6ntboz3.jpg` + const content = ` +![image](${imagePath}) + `.trim() + + const nodes = await plugin(createPluginOptions(content, imagePath)) + + expect(nodes.length).toBe(1) + + const node = nodes.pop() + expect(node.type).toBe(`html`) + expect(node.value).toMatchSnapshot() + expect(node.value).not.toMatch(``) +}) + test(`it transforms multiple images in markdown`, async () => { const imagePaths = [ `//images.ctfassets.net/rocybtov1ozk/wtrHxeu3zEoEce2MokCSi/73dce36715f16e27cf5ff0d2d97d7dff/quwowooybuqbl6ntboz3.jpg`, diff --git a/packages/gatsby-remark-images-contentful/src/index.js b/packages/gatsby-remark-images-contentful/src/index.js index 1feee08858458..3eb9374c73cb8 100644 --- a/packages/gatsby-remark-images-contentful/src/index.js +++ b/packages/gatsby-remark-images-contentful/src/index.js @@ -40,6 +40,11 @@ module.exports = async ( return resolve() } + let originalImg = node.url + if (!/^(http|https)?:\/\//i.test(node.url)) { + originalImg = `https:${node.url}` + } + const srcSplit = node.url.split(`/`) const fileName = srcSplit[srcSplit.length - 1] const options = _.defaults(pluginOptions, defaults) @@ -59,7 +64,7 @@ module.exports = async ( const response = await axios({ method: `GET`, - url: `https:${node.url}`, // for some reason there is a './' prefix + url: originalImg, // for some reason there is a './' prefix responseType: `stream`, }) @@ -71,18 +76,18 @@ module.exports = async ( const responsiveSizesResult = await buildResponsiveSizes({ metadata, - imageUrl: `https:${node.url}`, + imageUrl: originalImg, options, }) + // Calculate the paddingBottom % const ratio = `${(1 / responsiveSizesResult.aspectRatio) * 100}%` - const fallbackSrc = `https:${node.url}` + const fallbackSrc = originalImg const srcSet = responsiveSizesResult.srcSet const presentationWidth = responsiveSizesResult.presentationWidth // Generate default alt tag - const originalImg = node.url const fileNameNoExt = fileName.replace(/\.[^/.]+$/, ``) const defaultAlt = fileNameNoExt.replace(/[^A-Z0-9]/gi, ` `) From 1c51831e57518e35603939c9b7ba6bcd8cf340e8 Mon Sep 17 00:00:00 2001 From: Addy Osmani Date: Tue, 11 Dec 2018 15:34:04 -0800 Subject: [PATCH 10/33] feat(prefetch): add support for effective-connection-type & saveData (#10365) This change introduces support for network and data-savings related checks to the Gatsby prefetcher. * If a browser supports [navigator.connection.effectiveType](https://developer.mozilla.org/en-US/docs/Web/API/NetworkInformation/effectiveType), we will not prefetch if the user is on a connection that is effectively `slow-2g` or `2g`. As users on these connections already have constrained bandwidth, limiting this feature to `3g`, `4g` and better seems reasonable. * If a browser supports the [saveData](https://github.com/WICG/netinfo/issues/42) client-hint (e.g. Chromium based browsers) and the user has indicated they prefer to save data (e.g. are on a constrained data plan), we also don't prefetch in those cases. Data Saving is primarily turned on in NBU regions and I don't anticipate this change having any negative effect for users with the feature off. --- .../cypress/integration/prefetching.js | 27 +++++++++++++++++++ .../cypress/plugins/index.js | 13 +++++++++ .../production-runtime/gatsby-browser.js | 4 +++ e2e-tests/production-runtime/package.json | 4 ++- packages/gatsby/cache-dir/loader.js | 10 +++++++ 5 files changed, 57 insertions(+), 1 deletion(-) create mode 100644 e2e-tests/production-runtime/cypress/integration/prefetching.js diff --git a/e2e-tests/production-runtime/cypress/integration/prefetching.js b/e2e-tests/production-runtime/cypress/integration/prefetching.js new file mode 100644 index 0000000000000..cd813310cd5cd --- /dev/null +++ b/e2e-tests/production-runtime/cypress/integration/prefetching.js @@ -0,0 +1,27 @@ +describe(`Prefetching`, () => { + if (Cypress.env(`CONNECTION_TYPE`) === `slow`) { + it(`should not prefetch if on slow connection`, () => { + cy.visit(`/`).waitForAPI(`onRouteUpdate`) + + cy.window().then(win => { + const isPrefetching = win.___loader.enqueue(`/page-2`) + expect(isPrefetching).to.equal(false) + }) + + cy.get(`link[rel="prefetch"]`).should(`not.exist`) + cy.lifecycleCallCount(`onPrefetchPathname`).should(`equal`, 0) + }) + } else { + it(`should prefetch`, () => { + cy.visit(`/`).waitForAPI(`onRouteUpdate`) + + cy.window().then(win => { + const isPrefetching = win.___loader.enqueue(`/page-2`) + expect(isPrefetching).to.equal(true) + }) + + cy.get(`link[rel="prefetch"]`).should(`exist`) + cy.lifecycleCallCount(`onPrefetchPathname`).should(`not.equal`, 0) + }) + } +}) diff --git a/e2e-tests/production-runtime/cypress/plugins/index.js b/e2e-tests/production-runtime/cypress/plugins/index.js index fd170fba6912b..871f0fb6a83c5 100644 --- a/e2e-tests/production-runtime/cypress/plugins/index.js +++ b/e2e-tests/production-runtime/cypress/plugins/index.js @@ -14,4 +14,17 @@ module.exports = (on, config) => { // `on` is used to hook into various events Cypress emits // `config` is the resolved Cypress config + + if (process.env.CYPRESS_CONNECTION_TYPE) { + on(`before:browser:launch`, (browser = {}, args) => { + if ( + browser.name === `chrome` && + process.env.CYPRESS_CONNECTION_TYPE === `slow` + ) { + args.push(`--force-effective-connection-type=2G`) + } + + return args + }) + } } diff --git a/e2e-tests/production-runtime/gatsby-browser.js b/e2e-tests/production-runtime/gatsby-browser.js index f81cf6249d3e9..49618a228a63b 100644 --- a/e2e-tests/production-runtime/gatsby-browser.js +++ b/e2e-tests/production-runtime/gatsby-browser.js @@ -18,3 +18,7 @@ exports.onPreRouteUpdate = ({ location }) => { exports.onRouteUpdate = ({ location }) => { addLogEntry(`onRouteUpdate`, location) } + +exports.onPrefetchPathname = ({ pathname }) => { + addLogEntry(`onPrefetchPathname`, pathname) +} diff --git a/e2e-tests/production-runtime/package.json b/e2e-tests/production-runtime/package.json index 937217f8e0720..19ccb0d841f3d 100644 --- a/e2e-tests/production-runtime/package.json +++ b/e2e-tests/production-runtime/package.json @@ -26,7 +26,9 @@ "start-server-and-test": "start-server-and-test serve http://localhost:9000 cy:run", "serve": "gatsby serve", "cy:open": "cypress open", - "cy:run": "cypress run --browser chrome" + "cy:run": "npm run cy:run:normal && npm run cy:run:slow", + "cy:run:normal": "cypress run --browser chrome", + "cy:run:slow": "CYPRESS_CONNECTION_TYPE=slow cypress run --browser chrome --config testFiles=prefetching.js" }, "devDependencies": { "prettier": "^1.14.3", diff --git a/packages/gatsby/cache-dir/loader.js b/packages/gatsby/cache-dir/loader.js index 23a3dde924a7e..568b627213432 100644 --- a/packages/gatsby/cache-dir/loader.js +++ b/packages/gatsby/cache-dir/loader.js @@ -193,6 +193,16 @@ const queue = { if (!apiRunner) console.error(`Run setApiRunnerForLoader() before enqueing paths`) + // Skip prefetching if we know user is on slow or constrained connection + if (`connection` in navigator) { + if ((navigator.connection.effectiveType || ``).includes(`2g`)) { + return false + } + if (navigator.connection.saveData) { + return false + } + } + // Tell plugins with custom prefetching logic that they should start // prefetching this path. onPrefetchPathname(path) From 1b239f3d3d86fb9374c686a15c7f5c2c3f1722ae Mon Sep 17 00:00:00 2001 From: Michal Piechowiak Date: Wed, 12 Dec 2018 00:36:31 +0100 Subject: [PATCH 11/33] chore(release): Publish - gatsby-plugin-manifest@2.0.12 - gatsby-remark-images-contentful@2.0.5 - gatsby@2.0.66 --- packages/gatsby-plugin-manifest/CHANGELOG.md | 6 ++++++ packages/gatsby-plugin-manifest/package.json | 2 +- packages/gatsby-remark-images-contentful/CHANGELOG.md | 8 ++++++++ packages/gatsby-remark-images-contentful/package.json | 2 +- packages/gatsby/CHANGELOG.md | 8 ++++++++ packages/gatsby/package.json | 2 +- 6 files changed, 25 insertions(+), 3 deletions(-) diff --git a/packages/gatsby-plugin-manifest/CHANGELOG.md b/packages/gatsby-plugin-manifest/CHANGELOG.md index edbdd1796c24b..ad10905f22e71 100644 --- a/packages/gatsby-plugin-manifest/CHANGELOG.md +++ b/packages/gatsby-plugin-manifest/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.12](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-manifest/compare/gatsby-plugin-manifest@2.0.11...gatsby-plugin-manifest@2.0.12) (2018-12-11) + +**Note:** Version bump only for package gatsby-plugin-manifest + ## [2.0.11](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-manifest/compare/gatsby-plugin-manifest@2.0.10...gatsby-plugin-manifest@2.0.11) (2018-11-29) diff --git a/packages/gatsby-plugin-manifest/package.json b/packages/gatsby-plugin-manifest/package.json index 22af1c02190a2..0e606bc7120c7 100644 --- a/packages/gatsby-plugin-manifest/package.json +++ b/packages/gatsby-plugin-manifest/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-manifest", "description": "Gatsby plugin which adds a manifest.webmanifest to make sites progressive web apps", - "version": "2.0.11", + "version": "2.0.12", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby-remark-images-contentful/CHANGELOG.md b/packages/gatsby-remark-images-contentful/CHANGELOG.md index adba03e229830..5daa342956565 100644 --- a/packages/gatsby-remark-images-contentful/CHANGELOG.md +++ b/packages/gatsby-remark-images-contentful/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.5](https://github.com/gatsbyjs/gatsby/compare/gatsby-remark-images-contentful@2.0.4...gatsby-remark-images-contentful@2.0.5) (2018-12-11) + +### Bug Fixes + +- **gatsby-remark-images-contentful:** fix image urls with https/http prefix ([#7537](https://github.com/gatsbyjs/gatsby/issues/7537)) ([768aaa0](https://github.com/gatsbyjs/gatsby/commit/768aaa0)) + ## [2.0.4](https://github.com/gatsbyjs/gatsby/compare/gatsby-remark-images-contentful@2.0.3...gatsby-remark-images-contentful@2.0.4) (2018-11-20) diff --git a/packages/gatsby-remark-images-contentful/package.json b/packages/gatsby-remark-images-contentful/package.json index d4c72d4abc66b..ae3ec7115dee8 100644 --- a/packages/gatsby-remark-images-contentful/package.json +++ b/packages/gatsby-remark-images-contentful/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-remark-images-contentful", - "version": "2.0.4", + "version": "2.0.5", "description": "Process Images in Contentful markdown so they can use the images API.", "main": "index.js", "scripts": { diff --git a/packages/gatsby/CHANGELOG.md b/packages/gatsby/CHANGELOG.md index 9293fd361473b..2b7a57a4ac156 100644 --- a/packages/gatsby/CHANGELOG.md +++ b/packages/gatsby/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.66](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.0.65...gatsby@2.0.66) (2018-12-11) + +### Features + +- **prefetch:** add support for effective-connection-type & saveData ([#10365](https://github.com/gatsbyjs/gatsby/issues/10365)) ([1c51831](https://github.com/gatsbyjs/gatsby/commit/1c51831)) + ## [2.0.65](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.0.64...gatsby@2.0.65) (2018-12-11) diff --git a/packages/gatsby/package.json b/packages/gatsby/package.json index 48c02418e5ad4..3a6f19079a4be 100644 --- a/packages/gatsby/package.json +++ b/packages/gatsby/package.json @@ -1,7 +1,7 @@ { "name": "gatsby", "description": "Blazing fast modern site generator for React", - "version": "2.0.65", + "version": "2.0.66", "author": "Kyle Mathews ", "bin": { "gatsby": "./dist/bin/gatsby.js" From e6463a80ba7a34cacbd63f247c553e84d9ece87d Mon Sep 17 00:00:00 2001 From: Robert Cooper Date: Wed, 12 Dec 2018 04:56:34 -0500 Subject: [PATCH 12/33] docs(site-showcase): Add LANDR website to site showcase (#10426) --- docs/sites.yml | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/docs/sites.yml b/docs/sites.yml index 047c3295d31fd..ab5dc7400344c 100644 --- a/docs/sites.yml +++ b/docs/sites.yml @@ -3746,3 +3746,14 @@ built_by_url: "https://github.com/LekoArts" description: > Source from The Movie Database (TMDb) API (v3) in Gatsby. This example is built with react-spring, React hooks and react-tabs and showcases the gatsby-source-tmdb plugin. It also has some client-only paths and uses gatsby-image. +- title: LANDR - Creative Tools for Musicians + url: https://www.landr.com/en/ + main_url: https://www.landr.com/en/ + categories: + - Music + - Technology + featured: false + built_by: LANDR + built_by_url: "https://github.com/Mixgenius" + description: > + Marketing website built for LANDR. LANDR is a web application that provides tools for musicians to master their music (using artificial intelligence), collaborate with other musicians, and distribute their music to multiple platforms. From 37f26c08fd577b32f676c6d76d5c6c0044e5ab78 Mon Sep 17 00:00:00 2001 From: Andrea Gherardi Date: Wed, 12 Dec 2018 14:16:45 +0100 Subject: [PATCH 13/33] docs: fix link to node-tracking.js file (#10429) I was reading the docs and I found that the link to `node-tracking.js` was taking me to Github's 404 page, so I looked into the repo and found it had been moved from `/schema` to `/db`. I checked the referenced lines (9 and 32) and they do match the function names cited in the docs. --- docs/docs/node-tracking.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/docs/node-tracking.md b/docs/docs/node-tracking.md index 19ce6445790e3..8f4a736ff7430 100644 --- a/docs/docs/node-tracking.md +++ b/docs/docs/node-tracking.md @@ -4,7 +4,7 @@ title: Node Tracking ## Track Nodes -You may see calls to `trackInlineObjectsInRootNode()` and `findRootNodeAncestor()` in some parts of the code. These are both defined in [schema/node-tracking.js](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/schema/node-tracking.js). Node tracking is the tracking of relationships between a node's object values (not children), and the node's ID. E.g Take, the following node: +You may see calls to `trackInlineObjectsInRootNode()` and `findRootNodeAncestor()` in some parts of the code. These are both defined in [schema/node-tracking.js](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/db/node-tracking.js). Node tracking is the tracking of relationships between a node's object values (not children), and the node's ID. E.g Take, the following node: ```javascript let nodeA = { @@ -22,7 +22,7 @@ let nodeA = { } ``` -Its sub objects are `foo` (value = `{ myfile: "blog/my-blog.md", b: 2}`), and those in the `baz` array (`{ x: 8 }`). Node tracking will track those back to the top level node's ID (`id2` in this case). The [trackInlineObjectsinRootNode()](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/schema/node-tracking.js#L32) function takes care of this and records those relationships in the [rootNodeMap](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/schema/node-tracking.js#L9) WeakMap. E.g after calling `trackInlineObjectsInRootNode(nodeA)`, `rootNodeMap` would contain the following records: +Its sub objects are `foo` (value = `{ myfile: "blog/my-blog.md", b: 2}`), and those in the `baz` array (`{ x: 8 }`). Node tracking will track those back to the top level node's ID (`id2` in this case). The [trackInlineObjectsinRootNode()](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/db/node-tracking.js#L32) function takes care of this and records those relationships in the [rootNodeMap](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/db/node-tracking.js#L9) WeakMap. E.g after calling `trackInlineObjectsInRootNode(nodeA)`, `rootNodeMap` would contain the following records: ```javascript // rootNodeMap: From 7a7995545d638f44828a9344037fb611cc37153d Mon Sep 17 00:00:00 2001 From: David Bailey <4248177+davidbailey00@users.noreply.github.com> Date: Wed, 12 Dec 2018 13:18:43 +0000 Subject: [PATCH 14/33] fix(docs): prompt => confirm (#10431) cc @DSchau --- docs/docs/add-offline-support-with-a-service-worker.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/docs/add-offline-support-with-a-service-worker.md b/docs/docs/add-offline-support-with-a-service-worker.md index 3ff18ac3a41f0..4dcb8d011e568 100644 --- a/docs/docs/add-offline-support-with-a-service-worker.md +++ b/docs/docs/add-offline-support-with-a-service-worker.md @@ -45,11 +45,11 @@ Note: Service worker registers only in production builds (`gatsby build`). ### Displaying a message when a service worker updates -To display a custom message once your service worker finds an update, you can use the [`onServiceWorkerUpdateFound`](/docs/browser-apis/#onServiceWorkerUpdateFound) browser API in your `gatsby-browser.js` file. The following code will display a prompt asking the user whether they would like to refresh the page when an update is found: +To display a custom message once your service worker finds an update, you can use the [`onServiceWorkerUpdateFound`](/docs/browser-apis/#onServiceWorkerUpdateFound) browser API in your `gatsby-browser.js` file. The following code will display a confirm prompt asking the user whether they would like to refresh the page when an update is found: ```javascript:title=gatsby-browser.js exports.onServiceWorkerUpdateFound = () => { - const answer = window.prompt( + const answer = window.confirm( `This application has been updated. ` + `Reload to display the latest version?` ) From c0d11b5e2d16cad1d82d8828e62277d8f4d20d01 Mon Sep 17 00:00:00 2001 From: David Bailey <4248177+davidbailey00@users.noreply.github.com> Date: Wed, 12 Dec 2018 13:21:15 +0000 Subject: [PATCH 15/33] docs(gatsby-plugin-offline): specify to not HTTP-cache sw.js (#10430) Fixes #9671 --- docs/docs/caching.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/docs/caching.md b/docs/docs/caching.md index b77592aa47765..206cff161d48a 100644 --- a/docs/docs/caching.md +++ b/docs/docs/caching.md @@ -24,6 +24,8 @@ JavaScript and CSS files _generated by webpack_ should also be cached forever. L The `cache-control` header should be `cache-control: public, max-age=31536000,immutable` +The only exception to this is the file `/sw.js`, which needs to be revalidated upon each load to check if a new version of the site is available. This file is generated by `gatsby-plugin-offline` and other service worker plugins, in order to serve content offline. Its `cache-control` header should be `cache-control: public, max-age=0, must-revalidate` + ## Setting up caching on different hosts How you setup your caching depends on how you host your site. We encourage people to create Gatsby plugins per host to automate the creation of caching headers. From 3ba82a3a2875c8aec8404bfd967cc20ed4a2e2f7 Mon Sep 17 00:00:00 2001 From: Robert Cooper Date: Wed, 12 Dec 2018 10:31:24 -0500 Subject: [PATCH 16/33] docs(starter-library): add example to starter library (#10425) * docs(starter-library): add example to starter library * docs: update Netlify CMS spelling Co-Authored-By: robertcoopercode * docs: rename Sass tag Co-Authored-By: robertcoopercode * docs: remove 'responsive' tag Co-Authored-By: robertcoopercode * docs: remove 'Gatsby V2' tag Co-Authored-By: robertcoopercode --- docs/starters.yml | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/docs/starters.yml b/docs/starters.yml index 416c807e1c438..b88e64aa42f11 100644 --- a/docs/starters.yml +++ b/docs/starters.yml @@ -1363,3 +1363,15 @@ - Local search powered by Lunr - Syntax highlighting - Images +- url: https://gatsby-netlify-cms-example.netlify.com/ + repo: https://github.com/robertcoopercode/gatsby-netlify-cms + description: Gatsby starter using Netlify CMS + tags: + - Netlify CMS + - Styling:SCSS + features: + - Example of a website for a local developer meetup group + - NetlifyCMS used for easy data entry + - Mobile-friendly design + - Styling done with Sass + - Gatsby version 2 From 069918a4fd5298991b056397d725f941606e12d4 Mon Sep 17 00:00:00 2001 From: Alexandre Kirszenberg Date: Wed, 12 Dec 2018 15:49:34 +0000 Subject: [PATCH 17/33] [gatsby-image] re: fade out base64 on full image load (#7539) * Make initial state be the same on both client and server * Fix for browser env without Intersection Observer available * Simpler implementation * Typo --- .../src/__tests__/__snapshots__/index.js.snap | 12 ++++++------ packages/gatsby-image/src/__tests__/index.js | 3 ++- packages/gatsby-image/src/index.js | 12 +++++------- 3 files changed, 13 insertions(+), 14 deletions(-) diff --git a/packages/gatsby-image/src/__tests__/__snapshots__/index.js.snap b/packages/gatsby-image/src/__tests__/__snapshots__/index.js.snap index acdeda03b9b06..526704fd7850b 100644 --- a/packages/gatsby-image/src/__tests__/__snapshots__/index.js.snap +++ b/packages/gatsby-image/src/__tests__/__snapshots__/index.js.snap @@ -10,11 +10,11 @@ exports[` should render fixed size images 1`] = ` alt="" class="placeholder" src="string_of_base64" - style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 0; color: red;" + style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 1; color: red;" title="Title for the image" />
@@ -29,7 +29,7 @@ exports[` should render fixed size images 1`] = ` alt="Alt text for the image" height="100" src="test_image.jpg" - style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 1;" + style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 0;" title="Title for the image" width="100" /> @@ -54,11 +54,11 @@ exports[` should render fluid images 1`] = ` alt="" class="placeholder" src="string_of_base64" - style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 0; color: red;" + style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 1; color: red;" title="Title for the image" />
@@ -74,7 +74,7 @@ exports[` should render fluid images 1`] = ` Alt text for the image diff --git a/packages/gatsby-image/src/__tests__/index.js b/packages/gatsby-image/src/__tests__/index.js index c4ac37f1215cb..e6f3a669bdd35 100644 --- a/packages/gatsby-image/src/__tests__/index.js +++ b/packages/gatsby-image/src/__tests__/index.js @@ -67,8 +67,9 @@ describe(``, () => { expect(placeholderImageTag.getAttribute(`title`)).toEqual( `Title for the image` ) + // No Intersection Observer in JSDOM, so placeholder img will be visible (opacity 1) by default expect(placeholderImageTag.getAttribute(`style`)).toEqual( - `position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 0; color: red;` + `position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 1; color: red;` ) expect(placeholderImageTag.getAttribute(`class`)).toEqual(`placeholder`) }) diff --git a/packages/gatsby-image/src/index.js b/packages/gatsby-image/src/index.js index 4686182ca244e..3c2870667a5ec 100644 --- a/packages/gatsby-image/src/index.js +++ b/packages/gatsby-image/src/index.js @@ -127,10 +127,9 @@ class Image extends React.Component { constructor(props) { super(props) - // If this browser doesn't support the IntersectionObserver API - // we default to start downloading the image right away. + // default settings for browser without Intersection Observer available let isVisible = true - let imgLoaded = true + let imgLoaded = false let IOSupported = false let fadeIn = props.fadeIn @@ -138,25 +137,24 @@ class Image extends React.Component { // already in the browser cache so it's cheap to just show directly. const seenBefore = inImageCache(props) + // browser with Intersection Observer available if ( !seenBefore && typeof window !== `undefined` && window.IntersectionObserver ) { isVisible = false - imgLoaded = false IOSupported = true } - // Always don't render image while server rendering + // Never render image during SSR if (typeof window === `undefined`) { isVisible = false - imgLoaded = false } + // Force render for critical images if (props.critical) { isVisible = true - imgLoaded = false IOSupported = false } From 39f3c3a99edeb608e8a7054a329a01f4a8da7251 Mon Sep 17 00:00:00 2001 From: Mike Allanson Date: Wed, 12 Dec 2018 16:36:00 +0000 Subject: [PATCH 18/33] chore(release): Publish - gatsby-image@2.0.24 --- packages/gatsby-image/CHANGELOG.md | 6 ++++++ packages/gatsby-image/package.json | 2 +- 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/packages/gatsby-image/CHANGELOG.md b/packages/gatsby-image/CHANGELOG.md index 554a225a614f1..40542b3695046 100644 --- a/packages/gatsby-image/CHANGELOG.md +++ b/packages/gatsby-image/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.24](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image/compare/gatsby-image@2.0.23...gatsby-image@2.0.24) (2018-12-12) + +**Note:** Version bump only for package gatsby-image + ## [2.0.23](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image/compare/gatsby-image@2.0.22...gatsby-image@2.0.23) (2018-12-11) diff --git a/packages/gatsby-image/package.json b/packages/gatsby-image/package.json index 5ea983f1f6528..56a0cc6e834d6 100644 --- a/packages/gatsby-image/package.json +++ b/packages/gatsby-image/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-image", "description": "Lazy-loading React image component with optional support for the blur-up effect.", - "version": "2.0.23", + "version": "2.0.24", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" From 94255a3ca7c0aad67c199205e87f40a9990f2123 Mon Sep 17 00:00:00 2001 From: Lennart Date: Wed, 12 Dec 2018 17:46:05 +0100 Subject: [PATCH 19/33] fix(docs): Environment Variables Examples (#10406) * Add example + fix code for ENV var doc * Address michal's suggestions * Update environment-variables.md --- docs/docs/environment-variables.md | 43 +++++++++++++++++++++--------- 1 file changed, 31 insertions(+), 12 deletions(-) diff --git a/docs/docs/environment-variables.md b/docs/docs/environment-variables.md index 9d002b096f75b..a47edb02251d9 100644 --- a/docs/docs/environment-variables.md +++ b/docs/docs/environment-variables.md @@ -47,6 +47,10 @@ In addition to these Project Environment Variables defined in `.env.*` files, yo OS Env Vars. OS Env Vars which are prefixed with `GATSBY_` will become available in browser JavaScript. +```shell:title=.env.* +GATSBY_API_URL=https://dev.example.com/api +``` + #### Server-side Node.js Gatsby runs several Node.js scripts at build time, notably `gatsby-config.js` and `gatsby-node.js`. @@ -77,31 +81,47 @@ Now the variables are available on `process.env` as usual. ## Example -```shell -# Example .env.development file +Please note that you shouldn't commit `.env.*` files to your source control and rather use options given by your CD provider (e.g. Netlify with its [build environment variables](https://www.netlify.com/docs/continuous-deployment/#build-environment-variables)). -API_URL=https://dev.example.com/api +```shell:title=.env.development +GATSBY_API_URL=https://dev.example.com/api +API_KEY=927349872349798 ``` -```shell -# Example .env.production file - -API_URL=https://example.com/api +```shell:title=.env.production +GATSBY_API_URL=https://example.com/api +API_KEY=927349872349798 ``` -These variables will be available to your site as `process.env.API_URL`: +`GATSBY_API_URL` will be available to your site (Client-side and server-side) as `process.env.GATSBY_API_URL`: ```jsx -// usage +// In any front-end code render() { return (
- Logo + Logo
) } ``` +`API_KEY` will be available to your site (Server-side) as `process.env.API_KEY`. If you commit your `.env.*` file containing `API_KEY` to source control it would also be available on the client-side. However we strongly advise against that! You should prefix your variable with `GATSBY_` (as shown above) instead and Gatsby automatically makes it available in the browser context. + +```js +// In any server-side code, e.g. gatsby-config.js +module.exports = { + plugins: [ + { + resolve: `gatsby-source-patronus`, + options: { + apiKey: process.env.API_KEY, + }, + }, + ], +} +``` + ## Reserved Environment Variables: > You can not override certain environment variables as some are used internally @@ -121,8 +141,7 @@ For instance. If you would like to add a `staging` environment with a custom Goo ### Example -```shell -# .env.staging +```shell:title=.env.staging GA_TRACKING_ID="UA-1234567890" API_URL="http://foo.bar" ``` From c12336a5bcd546b75c146b6be2e5c3e9f15fa1bc Mon Sep 17 00:00:00 2001 From: Enzo Ferey Date: Wed, 12 Dec 2018 20:25:31 +0100 Subject: [PATCH 20/33] docs(babel-preset-gatsby): document --save-dev flag in README (#10434) As it is documented on the preset READMe ([`babel-preset-gatsby`](https://github.com/gatsbyjs/gatsby/tree/master/packages/babel-preset-gatsby)), it should be installed as a devDependency. --- docs/docs/babel.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/babel.md b/docs/docs/babel.md index de043dab5d5c2..c0a1cf3c4f139 100644 --- a/docs/docs/babel.md +++ b/docs/docs/babel.md @@ -25,7 +25,7 @@ Gatsby ships with a default .babelrc setup that should work for most sites. If y to add custom Babel presets or plugins, you can create your own `.babelrc` at the root of your site, import [`babel-preset-gatsby`](https://github.com/gatsbyjs/gatsby/tree/master/packages/babel-preset-gatsby), and overwrite the `target` option. ```bash -npm install --save babel-preset-gatsby +npm install --save-dev babel-preset-gatsby ``` ```json5:title=.babelrc From 9920d3b66c52f63f35b6ae404ddae7144bbf0853 Mon Sep 17 00:00:00 2001 From: Lionel Date: Wed, 12 Dec 2018 20:45:56 +0100 Subject: [PATCH 21/33] docs: add ClinciJS website into showcase (#10437) * Add ClinciJS website into showcase * Update sites.yml --- docs/sites.yml | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/docs/sites.yml b/docs/sites.yml index ab5dc7400344c..0d38bbc2472e7 100644 --- a/docs/sites.yml +++ b/docs/sites.yml @@ -3757,3 +3757,15 @@ built_by_url: "https://github.com/Mixgenius" description: > Marketing website built for LANDR. LANDR is a web application that provides tools for musicians to master their music (using artificial intelligence), collaborate with other musicians, and distribute their music to multiple platforms. +- title: ClinicJS + url: https://clinicjs.org/ + main_url: https://clinicjs.org/ + categories: + - Performance + - Technology + - Documentation + featured: false + built_by: NearForm + built_by_url: "https://www.nearform.com/" + description: > + Tools to help diagnose and pinpoint Node.js performance issues. From d800aaef4e6dce46c729b392e6d2f8dca6127c87 Mon Sep 17 00:00:00 2001 From: Zafarullah Mahmood Date: Thu, 13 Dec 2018 03:27:53 +0530 Subject: [PATCH 22/33] Fixed minor Typos and grammatical errors (#9353) Fixed some typos and grammatical errors in docs/docs Contributed as a part of Hacktoberfest 2018 --- docs/docs/add-a-manifest-file.md | 4 ++-- docs/docs/adding-analytics.md | 2 +- docs/docs/adding-images-fonts-files.md | 2 +- docs/docs/adding-markdown-pages.md | 2 +- docs/docs/adding-tags-and-categories-to-blog-posts.md | 2 +- docs/docs/api-proxy.md | 4 ++-- docs/docs/api-specification.md | 6 +++--- docs/docs/babel.md | 2 +- docs/docs/behind-the-scenes-terminology.md | 2 +- docs/docs/building-with-components.md | 2 +- docs/docs/centralizing-your-sites-navigation.md | 8 ++++---- docs/docs/create-source-plugin.md | 6 +++--- docs/docs/create-transformer-plugin.md | 4 ++-- 13 files changed, 23 insertions(+), 23 deletions(-) diff --git a/docs/docs/add-a-manifest-file.md b/docs/docs/add-a-manifest-file.md index 28b379e96ada1..b2182a1689e9b 100644 --- a/docs/docs/add-a-manifest-file.md +++ b/docs/docs/add-a-manifest-file.md @@ -8,11 +8,11 @@ But first, what exactly _are_ PWAs? They are regular websites that take advantage of modern browser functionality to augment the web experience with app-like features and benefits. Check out [Google's overview](https://developers.google.com/web/progressive-web-apps/) of what defines a PWA experience and the [Progressive web apps (PWAs) doc](/docs/progressive-web-app/) to learn how a Gatsby site is a progressive web app. -Inclusion of a web app manifest is one of the three generally accepted [baseline requirements for a PWA](https://alistapart.com/article/yes-that-web-project-should-be-a-pwa#section1). +The inclusion of a web app manifest is one of the three generally accepted [baseline requirements for a PWA](https://alistapart.com/article/yes-that-web-project-should-be-a-pwa#section1). Quoting [Google](https://developers.google.com/web/fundamentals/web-app-manifest/): -> The web app manifest is a simple JSON file that tells the browser about your web application and how it should behave when 'installed' on the users mobile device or desktop. +> The web app manifest is a simple JSON file that tells the browser about your web application and how it should behave when 'installed' on the user's mobile device or desktop. [Gatsby's manifest plugin](/packages/gatsby-plugin-manifest/) configures Gatsby to create a `manifest.webmanifest` file on every site build. diff --git a/docs/docs/adding-analytics.md b/docs/docs/adding-analytics.md index f6e8df3f5056d..12769ebb1f330 100644 --- a/docs/docs/adding-analytics.md +++ b/docs/docs/adding-analytics.md @@ -30,7 +30,7 @@ You can find this tracking ID later by going to `Admin > Tracking Info > Trackin Now, it's time to configure Gatsby to send page views to your Google Analytics account. -We are going to use `gatsby-plugin-google-analytics`. For other analytics options (including Google Analytics gtag.js ang Google Tag Manager), check [other Gatsby analytics plugins](#other-gatsby-analytics-plugins). +We are going to use `gatsby-plugin-google-analytics`. For other analytics options (including Google Analytics gtag.js and Google Tag Manager), check [other Gatsby analytics plugins](#other-gatsby-analytics-plugins). ```bash npm install --save gatsby-plugin-google-analytics diff --git a/docs/docs/adding-images-fonts-files.md b/docs/docs/adding-images-fonts-files.md index 7d8a0a179f177..87dd1b99a5134 100644 --- a/docs/docs/adding-images-fonts-files.md +++ b/docs/docs/adding-images-fonts-files.md @@ -123,7 +123,7 @@ However, there is an **escape hatch** that you can use to add an asset outside o the module system. If you put a file into the `static` folder, it will **not** be processed by -Webpack. Instead it will be copied into the public folder untouched. E.g. if you +Webpack. Instead, it will be copied into the public folder untouched. E.g. if you add a file named `sun.jpg` to the static folder, it'll be copied to `public/sun.jpg`. To reference assets in the `static` folder, you'll need to [import a helper function from `gatsby` named `withPrefix`](/docs/gatsby-link/#prefixed-paths-helper). diff --git a/docs/docs/adding-markdown-pages.md b/docs/docs/adding-markdown-pages.md index 0b4b3923e65ff..a4fd1bb9ebe43 100644 --- a/docs/docs/adding-markdown-pages.md +++ b/docs/docs/adding-markdown-pages.md @@ -5,7 +5,7 @@ title: Adding Markdown Pages Gatsby can use markdown files to create pages in your site. You add plugins to read and understand folders with markdown files and from them create pages automatically. -Here's the steps Gatsby follows for making this happen. +Here are the steps Gatsby follows for making this happen. 1. Read files into Gatsby from the filesystem 2. Transform markdown to HTML and frontmatter to data diff --git a/docs/docs/adding-tags-and-categories-to-blog-posts.md b/docs/docs/adding-tags-and-categories-to-blog-posts.md index d4732a2a1a340..63b6332dec59e 100644 --- a/docs/docs/adding-tags-and-categories-to-blog-posts.md +++ b/docs/docs/adding-tags-and-categories-to-blog-posts.md @@ -42,7 +42,7 @@ If `gatsby develop` is running, restart it so Gatsby can pick up the new fields. ## Write a query to get all tags for your posts -Now these fields are available in the data layer. To use field data, query it using `graphql`. All fields are available to query inside `frontmatter` +Now, these fields are available in the data layer. To use field data, query it using `graphql`. All fields are available to query inside `frontmatter` Try running in GraphiQL (`localhost:8000/___graphql`) the following query diff --git a/docs/docs/api-proxy.md b/docs/docs/api-proxy.md index 7e8e7a14dd7a8..09ce4a7e146af 100644 --- a/docs/docs/api-proxy.md +++ b/docs/docs/api-proxy.md @@ -26,8 +26,8 @@ the right place in production. ## Advanced proxying -Sometimes you need more granular/flexible access to the develop server. -Gatsby exposes the [Express.js](https://expressjs.com/) develop server to your site's `gatsby-config.js` where you +Sometimes you need more granular/flexible access to the development server. +Gatsby exposes the [Express.js](https://expressjs.com/) development server to your site's `gatsby-config.js` where you can add Express middleware as needed. ```javascript:title=gatsby-config.js diff --git a/docs/docs/api-specification.md b/docs/docs/api-specification.md index d62b640014b4c..dca0a5b55b179 100644 --- a/docs/docs/api-specification.md +++ b/docs/docs/api-specification.md @@ -44,7 +44,7 @@ highlighting to code blocks. Transformer plugins are decoupled from source plugins. Transformer plugins look at the media type of new nodes created by source plugins to decide if they can transform it or not. Which means that a markdown transformer plugin can -transform markdown from any source without any other configuration e.g. from +transform markdown from any source without any other configuration e.g. from a file, a code comment, or external service like Trello which supports markdown in some of its data fields. @@ -97,7 +97,7 @@ fin Once the initial bootstrap is finished, we start `webpack-dev-server` and an express server for serving files for the development server, and for a production build, we start building the CSS then JavaScript then HTML with webpack. During these processes there are various extension points where plugins can -intervene. All major processes have a `onPre` and `onPost` e.g. `onPreBootstrap` +intervene. All major processes have an `onPre` and `onPost` e.g. `onPreBootstrap` and `onPostBootstrap` or `onPreBuild` or `onPostBuild`. During bootstrap, plugins can respond at various stages to APIs like `onCreatePages`, `onCreateBabelConfig`, and `onSourceNodes`. @@ -105,7 +105,7 @@ plugins can respond at various stages to APIs like `onCreatePages`, At each extension point, Gatsby identifies the plugins which implement the API and calls them in serial following their order in the site's `gatsby-config.js`. -In addition to extension APIs in node, plugins can also implement extension APIs +In addition to extension APIs in a node, plugins can also implement extension APIs in the server rendering process and the browser e.g. `onClientEntry` or `onRouteUpdate` diff --git a/docs/docs/babel.md b/docs/docs/babel.md index c0a1cf3c4f139..12acf4979e8ee 100644 --- a/docs/docs/babel.md +++ b/docs/docs/babel.md @@ -8,7 +8,7 @@ support for writing modern JavaScript — while still supporting older browsers. ## How to specify which browsers to support Gatsby supports by default the last two versions of major browsers, IE 9+, as well as -any browser that still as 1%+ browser share. +any browser that still has 1%+ browser share. This means we automatically compile your JavaScript to ensure it works on older browsers. We also automatically add polyfills as needed — no more shipping code which mysteriously diff --git a/docs/docs/behind-the-scenes-terminology.md b/docs/docs/behind-the-scenes-terminology.md index becb0455e0de4..d7eb4f0f3a2e5 100644 --- a/docs/docs/behind-the-scenes-terminology.md +++ b/docs/docs/behind-the-scenes-terminology.md @@ -43,7 +43,7 @@ It is also used by [gatsby-plugin-netlify](/packages/gatsby-plugin-netlify/?=net ### jsonName -The logical name for the page's query json result. The name is constructed during [createPage](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/redux/actions.js#L229) using a kebabHash of page path. E.g. For above page path, it is: +The logical name for the page's query json result. The name is constructed during [createPage](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/redux/actions.js#L229) using a kebabHash of page path. E.g. For the above page path, it is: `blog-2018-07-17-announcing-gatsby-preview-995` diff --git a/docs/docs/building-with-components.md b/docs/docs/building-with-components.md index 4a039aad0d5c4..87ca2c7f8df3f 100644 --- a/docs/docs/building-with-components.md +++ b/docs/docs/building-with-components.md @@ -118,7 +118,7 @@ export const pageQuery = graphql` `src/html.jsx` is responsible for everything other than where Gatsby lives in the ``. -In this file you can modify the `` metadata, general structure of the +In this file, you can modify the `` metadata and general structure of the document and add external links. Typically you should omit this from your site as the default html.js file will diff --git a/docs/docs/centralizing-your-sites-navigation.md b/docs/docs/centralizing-your-sites-navigation.md index d56d083a0a5b5..e12ffd176b92b 100644 --- a/docs/docs/centralizing-your-sites-navigation.md +++ b/docs/docs/centralizing-your-sites-navigation.md @@ -42,11 +42,11 @@ module.exports = { ### Viewing the `siteMetadata` in GraphQL -GraphQL can be used to query for information contained in the `siteMetadata` object located in your project's `gatsby-config.js`. In order to test this out you can start the `default-starter-project` in development mode by running `npm run develop`. +GraphQL can be used to query for information contained in the `siteMetadata` object located in your project's `gatsby-config.js`. In order to test this out, you can start the `default-starter-project` in development mode by running `npm run develop`. Navigate to `http://localhost:8000/___graphql` in your browser to view the GraphiQL editor, which enables you to test GraphQL queries on the underlying APIs. Using the documentation explorer you can view the current GraphQL schema for your project, which is an invaluable resource during development. -Examining the available types in GraphQL you will notice that you can query `site`. This GraphQL type further returns the `siteMetadata` which needs to be accessed to create the dynamic navigation. At this point it is useful if you know a little GraphQL in order to extract the menu links. If you are unfamiliar with GraphQL, there is some excellent documentation available at GraphQL's official website found [here](https://graphql.org/learn/) tha you can use to brush up on your skills! The query below will return the menu links. +Examining the available types in GraphQL you will notice that you can query `site`. This GraphQL type further returns the `siteMetadata` which needs to be accessed to create the dynamic navigation. At this point, it is useful if you know a little GraphQL in order to extract the menu links. If you are unfamiliar with GraphQL, there is some excellent documentation available at GraphQL's official website found [here](https://graphql.org/learn/) that you can use to brush up on your skills! The query below will return the menu links. ```js query SiteQuery { @@ -90,7 +90,7 @@ Perfect! You now have a way of obtaining data from the `gatsby-config.js` file. ### Pulling data inside the layout component -Inside your project, locate the `src/components` folder and navigate to the `layout.js` file. Within this layout component you should notice a component named `StaticQuery`. +Inside your project, locate the `src/components` folder and navigate to the `layout.js` file. Within this layout component, you should notice a component named `StaticQuery`. StaticQuery is a new component introduced in Gatsby V2, which allows you to run GraphQL queries within your components, not just pages. It allows developers to collocate data with their components. @@ -141,7 +141,7 @@ const Layout = ({ children }) => ( With the above changes to your `StaticQuery` component, the `render` property, which accepts a function that takes one argument, now has access to the menu links for use inside the function (as the argument). The last thing that is left to do is to display the site's navigation. -To do this, the header component that is already available in the project seems like it might be a good starting place to display the navigation. Lets pass the `menuLinks` object to this header component like so: +To do this, the header component that is already available in the project seems like it might be a good starting place to display the navigation. Let's pass the `menuLinks` object to this header component like so: ```diff:title=src/components/layout.js const Layout = ({ children }) => ( diff --git a/docs/docs/create-source-plugin.md b/docs/docs/create-source-plugin.md index f1ecd055d13e4..2979712ceb4f4 100644 --- a/docs/docs/create-source-plugin.md +++ b/docs/docs/create-source-plugin.md @@ -44,7 +44,7 @@ node for the markdown content and set its mediaType as `text/markdown` and the various Gatsby markdown transformer plugins will see your node and transform it into HTML. -This loose coupling between data source and transformer plugins allow Gatsby +This loose coupling between the data source and the transformer plugins allow Gatsby site builders to quickly assemble complex data transformation pipelines with little work on their (and your (the source plugin author)) part. @@ -54,7 +54,7 @@ A source plugin is a normal NPM package. It has a package.json with optional dependencies as well as a `gatsby-node.js` where you implement Gatsby's Node.js APIs. Gatsby supports node versions back to Node 4 and as it's common to want to use more modern Node.js and JavaScript syntax, many plugins write code in a -`src` directory and compile the code. All plugins maintained in the Gatsby repo +source directory and compile the code. All plugins maintained in the Gatsby repo follow this pattern. Your `gatsby-node.js` should look something like: @@ -110,7 +110,7 @@ There are two ways of adding node relationships in Gatsby: (1) transformations ( An example of a transformation relationship is the `gatsby-transformer-remark` plugin, which transforms a parent `fileNode`'s markdown string into a `MarkdownRemark` node. The Remark transformer plugin adds its newly created child node as a child of the parent node using the action `createParentChildLink`. Transformation relationships are used when a new node is _completely_ derived from a single parent node. E.g. the markdown node is derived from the parent `fileNode` and wouldn't ever exist if the parent `fileNode` hadn't been created. -Because all children nodes are derived from their parent, when a parent node is deleted or changed, Gatsby deletes all of the child nodes (and their child nodes, and so on) with the expectation that they'll be recreated again by transformer plugins. This is done to ensure there's not nodes left over that were derived from older versions of data but shouldn't exist any longer. +Because all children nodes are derived from their parent, when a parent node is deleted or changed, Gatsby deletes all of the child nodes (and their child nodes, and so on) with the expectation that they'll be recreated again by transformer plugins. This is done to ensure there are no nodes left over that were derived from older versions of data but shouldn't exist any longer. _Creating the transformation relationship_ diff --git a/docs/docs/create-transformer-plugin.md b/docs/docs/create-transformer-plugin.md index 43d4c746fd53d..80b9883163cff 100644 --- a/docs/docs/create-transformer-plugin.md +++ b/docs/docs/create-transformer-plugin.md @@ -35,9 +35,9 @@ Information on the purpose of this function can be found in the [API reference]( ## Using the cache -Sometimes transforming properties costs time and resources and in order to avoid recreating these properties at each run you can profit from the global cache mechanism Gatsby provides. +Sometimes transforming properties costs time and resources. In order to avoid recreating these properties at each run, you can profit from the global cache mechanism Gatsby provides. -Cache keys should at least contain the contentDigest of the concerned. For example the `gatsby-transformer-remark` uses the following cache key for the html node: +Cache keys should at least contain the contentDigest of the concerned. For example, the `gatsby-transformer-remark` uses the following cache key for the html node: ```javascript:title=extend-node-type.js const htmlCacheKey = node => From a0bba643fef5a980dd33320db1bbc7678108aa72 Mon Sep 17 00:00:00 2001 From: David Bailey <4248177+davidbailey00@users.noreply.github.com> Date: Wed, 12 Dec 2018 22:41:22 +0000 Subject: [PATCH 23/33] refactor(gatsby): improve EnsureResources (#10224) - `getDerivedStateFromProps` - Remove unused parameter `pageResources` - Return even if we don't have resources, to allow detecting them later - Remove `componentDidUpdate` and move some of its contents into new `retryResources` - Throw an error on initial render only upon missing resources - otherwise just don't update the component, and remove the function `shouldRenderStaticHTML` - Note: this may need updating in the future - React docs say `shouldComponentUpdate` is only for performance purposes and may not prevent rendering in future versions - Add a new function for detecting if we have resources which works for production and develop --- packages/gatsby/cache-dir/ensure-resources.js | 125 +++++++++--------- packages/gatsby/cache-dir/loader.js | 3 +- 2 files changed, 61 insertions(+), 67 deletions(-) diff --git a/packages/gatsby/cache-dir/ensure-resources.js b/packages/gatsby/cache-dir/ensure-resources.js index 53b611c0aa4ba..7b2f38244c043 100644 --- a/packages/gatsby/cache-dir/ensure-resources.js +++ b/packages/gatsby/cache-dir/ensure-resources.js @@ -3,6 +3,8 @@ import PropTypes from "prop-types" import loader from "./loader" import shallowCompare from "shallow-compare" +let isInitialRender = true + // Pass pathname in as prop. // component will try fetching resources. If they exist, // will just render, else will render null. @@ -19,53 +21,86 @@ class EnsureResources extends React.Component { } } - static getDerivedStateFromProps({ pageResources, location }, prevState) { + reloadPage(prevHref) { + // Do this, rather than simply `window.location.reload()`, so that + // pressing the back/forward buttons work - otherwise when pressing + // back, the browser will just change the URL and expect JS to handle + // the change, which won't always work since it might not be a Gatsby + // page. + const { href } = window.location + window.history.replaceState({}, ``, prevHref) + window.location.replace(href) + } + + static getDerivedStateFromProps({ location }, prevState) { if (prevState.location !== location) { const pageResources = loader.getResourcesForPathnameSync( location.pathname ) - if (pageResources) { - return { - pageResources, - location: { ...location }, - } + return { + pageResources, + location: { ...location }, } } return null } - componentDidUpdate(prevProps) { - if (prevProps === this.props) return + hasResources(pageResources) { + if (pageResources && pageResources.json) { + return true + } - const { pathname } = this.props.location + if (pageResources && process.env.NODE_ENV !== `production`) { + return true + } + + return false + } + + retryResources(nextProps) { + const { pathname } = nextProps.location + + if (!loader.getResourcesForPathnameSync(pathname)) { + // Store the previous and next location before resolving resources + const prevLocation = this.props.location + this.nextLocation = nextProps.location - if (!loader.getResourcesForPathnameSync(pathname)) // Page resources won't be set in cases where the browser back button // or forward button is pushed as we can't wait as normal for resources // to load before changing the page. loader.getResourcesForPathname(pathname).then(pageResources => { // The page may have changed since we started this, in which case doesn't update + if (this.nextLocation !== nextProps.location) { + return + } - if (this.props.location.pathname !== location.pathname) { + if (this.hasResources(pageResources)) { + this.setState({ + location: { ...window.location }, + pageResources, + }) return } - this.setState({ - location: { ...location }, - pageResources, - }) + // If we still don't have resources, reload the page. + // (This won't happen on initial render, since shouldComponentUpdate + // is only called when the component updates.) + this.reloadPage(prevLocation.href) }) + } } shouldComponentUpdate(nextProps, nextState) { - // 404 - if (!nextState.pageResources) { - return true + // Always return false if we're missing resources. + if (!this.hasResources(nextState.pageResources)) { + this.retryResources(nextProps) + return false } + // Check if the component or json have changed. - if (!this.state.pageResources && nextState.pageResources) { + if (this.state.pageResources !== nextState.pageResources) { return true } if ( @@ -92,54 +127,14 @@ class EnsureResources extends React.Component { return shallowCompare(this, nextProps, nextState) } - shouldRenderStaticHTML() { - const { localStorage } = window - const { href, pathname } = window.location - - // This should only occur if the network is offline, or if the - // path is nonexistent and there's no custom 404 page. - if ( - process.env.NODE_ENV === `production` && - !(this.state.pageResources && this.state.pageResources.json) - ) { - if (localStorage.getItem(`___failedResources`) === pathname) { - // Maybe it will work again in the future, so remove the flag - localStorage.removeItem(`___failedResources`) - console.error( - `WARNING: Resources cannot be loaded for the pathname ${pathname} - ` + - `falling back to static HTML instead.\n` + - `This is likely due to a bug in Gatsby, or misconfiguration in your project.` - ) - } else { - // Mark the pathname as failed - localStorage.setItem(`___failedResources`, pathname) - - // Reload the page. - // Do this, rather than simply `window.location.reload()`, so that - // pressing the back/forward buttons work - otherwise when pressing - // back, the browser will just change the URL and expect JS to handle - // the change, which won't always work since it might not be a Gatsby - // page. - const originalUrl = new URL(href) - window.history.replaceState({}, `404`, `${pathname}?gatsby-404`) - window.location.replace(originalUrl) - } - - return true - } else { - localStorage.removeItem(`___failedResources`) - return false - } - } - render() { - // TODO: find a nicer way to do this (e.g. React Suspense) - if (this.shouldRenderStaticHTML()) { - const __html = document.getElementById(`___gatsby`).innerHTML - return
- } else { - return this.props.children(this.state) + if (!this.hasResources(this.state.pageResources) && isInitialRender) { + // prevent hydrating + throw new Error(`Missing resources for ${this.state.location.pathname}`) } + + isInitialRender = false + return this.props.children(this.state) } } diff --git a/packages/gatsby/cache-dir/loader.js b/packages/gatsby/cache-dir/loader.js index 568b627213432..e4fe1928c53b5 100644 --- a/packages/gatsby/cache-dir/loader.js +++ b/packages/gatsby/cache-dir/loader.js @@ -89,8 +89,7 @@ const fetchResource = resourceName => { const fetchPromise = resourceFunction() let failed = false return fetchPromise - .catch(e => { - console.error(e) + .catch(() => { failed = true }) .then(component => { From f2b182133ce4cdc98b95e45ef7f466f957df20c8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?juliette=20pr=C3=A9tot?= Date: Wed, 12 Dec 2018 23:58:07 +0100 Subject: [PATCH 24/33] fix(gatsby-image): update typescript definitions - properly mark fields as optional (#10419) It seems like these should not be a mandatory. At the moment when building a TypeScript gatsby site, TypeScript forces the user to pass a value. --- packages/gatsby-image/index.d.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/gatsby-image/index.d.ts b/packages/gatsby-image/index.d.ts index c2252b03c162b..eaeebbc3e8e55 100644 --- a/packages/gatsby-image/index.d.ts +++ b/packages/gatsby-image/index.d.ts @@ -16,10 +16,10 @@ interface FluidObject { src: string srcSet: string sizes: string - base64: string - tracedSVG: string - srcWebp: string - srcSetWebp: string + base64?: string + tracedSVG?: string + srcWebp?: string + srcSetWebp?: string } interface GatsbyImageProps { @@ -34,7 +34,7 @@ interface GatsbyImageProps { critical?: boolean style?: object imgStyle?: object - placeholderStyle: object + placeholderStyle?: object backgroundColor?: string | boolean onLoad?: () => void onStartLoad?: (param: { wasCached: boolean }) => void From 45d2832a86be268dad77c5bb1cc3c815dfaf5944 Mon Sep 17 00:00:00 2001 From: Haroen Viaene Date: Thu, 13 Dec 2018 00:12:11 +0100 Subject: [PATCH 25/33] fix(www): avoid querying for no-cache=1 (#10389) --- www/src/components/plugin-searchbar-body.js | 15 ++++++--------- 1 file changed, 6 insertions(+), 9 deletions(-) diff --git a/www/src/components/plugin-searchbar-body.js b/www/src/components/plugin-searchbar-body.js index 046469db879fa..66213439521d2 100644 --- a/www/src/components/plugin-searchbar-body.js +++ b/www/src/components/plugin-searchbar-body.js @@ -174,10 +174,6 @@ injectGlobal` // Search shows a list of "hits", and is a child of the PluginSearchBar component class Search extends Component { - constructor(props, context) { - super(props) - } - render() { return (
)} /> @@ -415,7 +411,8 @@ class PluginSearchBar extends Component { urlToSearch = () => { if (this.props.location.search) { - return this.props.location.search.slice(2) + // ignore this automatically added query parameter + return this.props.location.search.replace(`no-cache=1`, ``).slice(2) } return `` } @@ -426,7 +423,7 @@ class PluginSearchBar extends Component { }) } - onSearchStateChange(searchState) { + onSearchStateChange = searchState => { this.updateHistory(searchState) this.setState({ searchState }) } @@ -439,11 +436,11 @@ class PluginSearchBar extends Component { appId="OFCNCOG2CU" indexName="npm-search" searchState={this.state.searchState} - onSearchStateChange={this.onSearchStateChange.bind(this)} + onSearchStateChange={this.onSearchStateChange} >
From d504d44b4fe0ed0ad0188c1c8bbd46eeebe7ee03 Mon Sep 17 00:00:00 2001 From: Victor Cordova Date: Thu, 13 Dec 2018 01:51:12 +0100 Subject: [PATCH 26/33] fix(gatsby): fix extracting StaticQuery nested in shorthand fragment (#10443) --- packages/gatsby/package.json | 1 - .../src/bootstrap/resolve-module-exports.js | 2 +- .../__snapshots__/file-parser.js.snap | 112 ++++++++++++++++++ .../query-runner/__tests__/file-parser.js | 21 ++++ .../query-runner/file-parser.js | 2 +- yarn.lock | 2 +- 6 files changed, 136 insertions(+), 4 deletions(-) diff --git a/packages/gatsby/package.json b/packages/gatsby/package.json index 3a6f19079a4be..78531cd05e013 100644 --- a/packages/gatsby/package.json +++ b/packages/gatsby/package.json @@ -27,7 +27,6 @@ "babel-plugin-dynamic-import-node": "^1.2.0", "babel-plugin-remove-graphql-queries": "^2.5.2", "babel-preset-gatsby": "^0.1.6", - "babel-traverse": "6.26.0", "better-queue": "^3.8.6", "bluebird": "^3.5.0", "browserslist": "3.2.8", diff --git a/packages/gatsby/src/bootstrap/resolve-module-exports.js b/packages/gatsby/src/bootstrap/resolve-module-exports.js index 30057db5361fe..f6367f740e76e 100644 --- a/packages/gatsby/src/bootstrap/resolve-module-exports.js +++ b/packages/gatsby/src/bootstrap/resolve-module-exports.js @@ -1,6 +1,6 @@ // @flow const fs = require(`fs`) -const traverse = require(`babel-traverse`).default +const traverse = require(`@babel/traverse`).default const get = require(`lodash/get`) const { codeFrameColumns } = require(`@babel/code-frame`) const { babelParseToAst } = require(`../utils/babel-parse-to-ast`) diff --git a/packages/gatsby/src/internal-plugins/query-runner/__tests__/__snapshots__/file-parser.js.snap b/packages/gatsby/src/internal-plugins/query-runner/__tests__/__snapshots__/file-parser.js.snap index d1c34627e3d77..d009d33559ca9 100644 --- a/packages/gatsby/src/internal-plugins/query-runner/__tests__/__snapshots__/file-parser.js.snap +++ b/packages/gatsby/src/internal-plugins/query-runner/__tests__/__snapshots__/file-parser.js.snap @@ -590,6 +590,118 @@ Map { ], "kind": "Document", }, + "fragment-shorthand.js" => Object { + "definitions": Array [ + Object { + "directives": Array [], + "hash": 1097489062, + "isStaticQuery": true, + "kind": "OperationDefinition", + "loc": Object { + "end": 74, + "start": 3, + }, + "name": Object { + "kind": "Name", + "value": "fragmentShorthandJs1097489062", + }, + "operation": "query", + "selectionSet": Object { + "kind": "SelectionSet", + "loc": Object { + "end": 74, + "start": 9, + }, + "selections": Array [ + Object { + "alias": undefined, + "arguments": Array [], + "directives": Array [], + "kind": "Field", + "loc": Object { + "end": 70, + "start": 15, + }, + "name": Object { + "kind": "Name", + "loc": Object { + "end": 19, + "start": 15, + }, + "value": "site", + }, + "selectionSet": Object { + "kind": "SelectionSet", + "loc": Object { + "end": 70, + "start": 20, + }, + "selections": Array [ + Object { + "alias": undefined, + "arguments": Array [], + "directives": Array [], + "kind": "Field", + "loc": Object { + "end": 64, + "start": 28, + }, + "name": Object { + "kind": "Name", + "loc": Object { + "end": 40, + "start": 28, + }, + "value": "siteMetadata", + }, + "selectionSet": Object { + "kind": "SelectionSet", + "loc": Object { + "end": 64, + "start": 41, + }, + "selections": Array [ + Object { + "alias": undefined, + "arguments": Array [], + "directives": Array [], + "kind": "Field", + "loc": Object { + "end": 56, + "start": 51, + }, + "name": Object { + "kind": "Name", + "loc": Object { + "end": 56, + "start": 51, + }, + "value": "title", + }, + "selectionSet": undefined, + }, + ], + }, + }, + ], + }, + }, + ], + }, + "text": " + query { + site { + siteMetadata { + title + } + } + } +", + "variableDefinitions": Array [], + }, + ], + "kind": "Document", + }, "query-in-separate-variable.js" => Object { "definitions": Array [ Object { diff --git a/packages/gatsby/src/internal-plugins/query-runner/__tests__/file-parser.js b/packages/gatsby/src/internal-plugins/query-runner/__tests__/file-parser.js index 680373ccf423e..707de4a2cd9ec 100644 --- a/packages/gatsby/src/internal-plugins/query-runner/__tests__/file-parser.js +++ b/packages/gatsby/src/internal-plugins/query-runner/__tests__/file-parser.js @@ -80,6 +80,27 @@ export const fragment3 = graphql\` } \` `, + "fragment-shorthand.js": `import React from "react" +import { StaticQuery, graphql } from "gatsby" + +const query = graphql\` + query { + site { + siteMetadata { + title + } + } + } +\` + +export default () => ( + <> +
{data.title}
} + /> + +)`, "query-in-separate-variable.js": `import React from "react" import { StaticQuery, graphql } from "gatsby" diff --git a/packages/gatsby/src/internal-plugins/query-runner/file-parser.js b/packages/gatsby/src/internal-plugins/query-runner/file-parser.js index e13d818001d13..997b3c5290a29 100644 --- a/packages/gatsby/src/internal-plugins/query-runner/file-parser.js +++ b/packages/gatsby/src/internal-plugins/query-runner/file-parser.js @@ -4,7 +4,7 @@ const crypto = require(`crypto`) const _ = require(`lodash`) // Traverse is a es6 module... -import traverse from "babel-traverse" +import traverse from "@babel/traverse" const getGraphQLTag = require(`babel-plugin-remove-graphql-queries`) .getGraphQLTag const report = require(`gatsby-cli/lib/reporter`) diff --git a/yarn.lock b/yarn.lock index 14adac823fefc..0693dd16be6e8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3701,7 +3701,7 @@ babel-template@^6.16.0, babel-template@^6.24.1, babel-template@^6.26.0, babel-te babylon "^6.18.0" lodash "^4.17.4" -babel-traverse@6.26.0, babel-traverse@^6.0.0, babel-traverse@^6.18.0, babel-traverse@^6.24.1, babel-traverse@^6.26.0: +babel-traverse@^6.0.0, babel-traverse@^6.18.0, babel-traverse@^6.24.1, babel-traverse@^6.26.0: version "6.26.0" resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.26.0.tgz#46a9cbd7edcc62c8e5c064e2d2d8d0f4035766ee" integrity sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4= From 5a08b7640c2db2c65696be56d81afee83b2ca9ec Mon Sep 17 00:00:00 2001 From: Michal Piechowiak Date: Thu, 13 Dec 2018 02:43:33 +0100 Subject: [PATCH 27/33] chore(release): Publish - gatsby-image@2.0.25 - gatsby@2.0.67 --- packages/gatsby-image/CHANGELOG.md | 8 ++++++++ packages/gatsby-image/package.json | 2 +- packages/gatsby/CHANGELOG.md | 8 ++++++++ packages/gatsby/package.json | 2 +- 4 files changed, 18 insertions(+), 2 deletions(-) diff --git a/packages/gatsby-image/CHANGELOG.md b/packages/gatsby-image/CHANGELOG.md index 40542b3695046..91adbf984067f 100644 --- a/packages/gatsby-image/CHANGELOG.md +++ b/packages/gatsby-image/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.25](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image/compare/gatsby-image@2.0.24...gatsby-image@2.0.25) (2018-12-13) + +### Bug Fixes + +- **gatsby-image:** update typescript definitions - properly mark fields as optional ([#10419](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image/issues/10419)) ([f2b1821](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image/commit/f2b1821)) + ## [2.0.24](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-image/compare/gatsby-image@2.0.23...gatsby-image@2.0.24) (2018-12-12) diff --git a/packages/gatsby-image/package.json b/packages/gatsby-image/package.json index 56a0cc6e834d6..df4cb3ad7fdc8 100644 --- a/packages/gatsby-image/package.json +++ b/packages/gatsby-image/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-image", "description": "Lazy-loading React image component with optional support for the blur-up effect.", - "version": "2.0.24", + "version": "2.0.25", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" diff --git a/packages/gatsby/CHANGELOG.md b/packages/gatsby/CHANGELOG.md index 2b7a57a4ac156..d2079e55b595d 100644 --- a/packages/gatsby/CHANGELOG.md +++ b/packages/gatsby/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [2.0.67](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.0.66...gatsby@2.0.67) (2018-12-13) + +### Bug Fixes + +- **gatsby:** fix extracting StaticQuery nested in shorthand fragment ([#10443](https://github.com/gatsbyjs/gatsby/issues/10443)) ([d504d44](https://github.com/gatsbyjs/gatsby/commit/d504d44)) + ## [2.0.66](https://github.com/gatsbyjs/gatsby/compare/gatsby@2.0.65...gatsby@2.0.66) (2018-12-11) diff --git a/packages/gatsby/package.json b/packages/gatsby/package.json index 78531cd05e013..8901070ed48f7 100644 --- a/packages/gatsby/package.json +++ b/packages/gatsby/package.json @@ -1,7 +1,7 @@ { "name": "gatsby", "description": "Blazing fast modern site generator for React", - "version": "2.0.66", + "version": "2.0.67", "author": "Kyle Mathews ", "bin": { "gatsby": "./dist/bin/gatsby.js" From ec3487ce07351c162a7bbca0bf6b9b4ce2a3fd11 Mon Sep 17 00:00:00 2001 From: Carl Rosell Date: Thu, 13 Dec 2018 15:57:55 +0100 Subject: [PATCH 28/33] fix(www) Fix query for plugin links always ?=undefined (#10453) Was just browsing the website and found that #10389 PR changed the prop passed to the Result component to query but did not update the Result component itself. https://github.com/gatsbyjs/gatsby/pull/10389/files#diff-86b9922590ad1703ea1c4ae10baab77cR252 --- www/src/components/plugin-searchbar-body.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/www/src/components/plugin-searchbar-body.js b/www/src/components/plugin-searchbar-body.js index 66213439521d2..7df01bede72a7 100644 --- a/www/src/components/plugin-searchbar-body.js +++ b/www/src/components/plugin-searchbar-body.js @@ -301,14 +301,14 @@ class Search extends Component { } // the result component is fed into the InfiniteHits component -const Result = ({ hit, pathname, search }) => { +const Result = ({ hit, pathname, query }) => { // Example: // pathname = `/plugins/gatsby-link/` || `/plugins/@comsoc/gatsby-mdast-copy-linked-files` // hit.name = `gatsby-link` || `@comsoc/gatsby-mdast-copy-linked-files` const selected = pathname.includes(hit.name) return ( Date: Thu, 13 Dec 2018 21:47:43 +0530 Subject: [PATCH 29/33] fix typo in pull request template (#10454) The spelling of "maintainer" was incorrect --- .github/PULL_REQUEST_TEMPLATE.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md index a4111dfee5abb..4b62aa84598b6 100644 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -1,6 +1,6 @@