diff --git a/benchmarks/gabe-fs-markdown-images/.gitignore b/benchmarks/gabe-fs-markdown-images/.gitignore new file mode 100644 index 0000000000000..1063e5588c8e6 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/.gitignore @@ -0,0 +1,74 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Directory for instrumented libs generated by jscoverage/JSCover +lib-cov + +# Coverage directory used by tools like istanbul +coverage + +# nyc test coverage +.nyc_output + +# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) +.grunt + +# Bower dependency directory (https://bower.io/) +bower_components + +# node-waf configuration +.lock-wscript + +# Compiled binary addons (http://nodejs.org/api/addons.html) +build/Release + +# Dependency directories +node_modules/ +jspm_packages/ + +# Typescript v1 declaration files +typings/ + +# Optional npm cache directory +.npm + +# Optional eslint cache +.eslintcache + +# Optional REPL history +.node_repl_history + +# Output of 'npm pack' +*.tgz + +# dotenv environment variable files +.env* + +# gatsby files +.cache/ +public + +# Mac files +.DS_Store + +# Yarn +yarn-error.log +.pnp/ +.pnp.js +# Yarn Integrity file +.yarn-integrity +yarn.lock + +generated_articles +generated_images +generated_image_pools diff --git a/benchmarks/gabe-fs-markdown-images/LICENSE b/benchmarks/gabe-fs-markdown-images/LICENSE new file mode 100644 index 0000000000000..1180a1cf3bdb6 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/LICENSE @@ -0,0 +1,21 @@ +The MIT License (MIT) + +Copyright (c) 2015 Gatsbyjs + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/benchmarks/gabe-fs-markdown-images/README.md b/benchmarks/gabe-fs-markdown-images/README.md new file mode 100644 index 0000000000000..59ea307439f46 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/README.md @@ -0,0 +1,63 @@ +# Baseline Gatsby Benchmark: fs + markdown + images + +This is a baseline benchmark site in the Gabe project. + +This site in particular tracks Markdown performance for individual files per page that also have an image (not part of the markdown). + +The site can generate an arbitrary amount of super simple pages. Each page has a small header, a quote, and two small paragraphs of random text. No images, because we want to benchmark Markdown. + +The results of this benchmark can be compared to the results of the `gabe-fs-markdown` benchmark, to see a tentative impact of using images in markdown. + +## Install + +Run `yarn` or `npm install` + +## Usage + +Unlike most other gabe benchmarks, the generation part is a little more complex because it will generate image file pools first and then copy images from those pools into their destination. + +### Image generation + +Image generation is rather expensive. The default size for 128k can take 2 hours single threaded. For that reason, the image generation can use workers instead. + +Recommended way for larger pages is to first generate all the images up to the amount you're going to use. These pools will persist across benchmarks so it's a one time cost: + +For example; to generate 128k 100x100 images using 8 worker threads: + +``` +C=8 W=100 H=100 N=128000 +``` + +This will require an up to date node because workers aren't available in node 10.13, you'll get a warning if that's the case. + +The files will be generated in `generated_image_pools/jpg/wxh`. If `C` is not set then it will only add images and assume the existing images are already properly incrementally numbered, without gaps. + +If `C` is set (and used) then it will regenerate all images regardless and use that many workers to divide the work. + +### Image usage + +When you run the benchmark, or generate the random content files, it will first check whether the pools have a sufficient amount of images. If they don't then the image pool is amended (see above). + +Once the pool contains enough images for a given type/dimension, the random `.md` files are generated and for each file an image is copied from the pool as well. The copying of images is a lot faster. + +It's important to note that the pool will persist between benchamrk runs, while the randomly generated content does not. + +### Running the benchmark + +Either way, you can start a benchmark run using the following. If the pool doesn't exist or does not have enough images, images will be generated: + +```shell +W=100 H=200 N=1000 M=2 yarn bench +``` + +- `N=1000`: instructs the run to build a site of 1000 pages +- `M=2`: instructs nodejs to use up to 2gb of memory for its long term storage +- `W=100`: use images that are 100px wide +- `H=200`: use images that are 200px high +- `C=8`: (optional) force regenerate the image pool for given size and use 8 worker threads while doing so. Only need to do this once per image type+dimension. +- Deletes generates files from previous run +- Generates `N` pages with pseudo-random content, copies one image from pool per page generated +- Runs `gatsby clean` +- Runs `gatsby build` + +The default `yarn bench` will build 512 pages with 1gb memory. diff --git a/benchmarks/gabe-fs-markdown-images/gatsby-config.js b/benchmarks/gabe-fs-markdown-images/gatsby-config.js new file mode 100644 index 0000000000000..151493fcd4640 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/gatsby-config.js @@ -0,0 +1,27 @@ +module.exports = { + siteMetadata: { + title: `Gatsby FS Markdown Benchmark for Gabe`, + description: "A blog like no other blog", + author: "Bob the Blogger", + }, + plugins: [ + `gatsby-transformer-remark`, + 'gatsby-plugin-image', + { + resolve: `gatsby-source-filesystem`, + options: { + name: `blog`, + path: `${__dirname}/generated_articles`, + }, + }, + { + resolve: `gatsby-source-filesystem`, + options: { + name: `img`, + path: `${__dirname}/generated_images`, + }, + }, + 'gatsby-plugin-sharp', + 'gatsby-transformer-sharp', + ], +} diff --git a/benchmarks/gabe-fs-markdown-images/gatsby-node.js b/benchmarks/gabe-fs-markdown-images/gatsby-node.js new file mode 100644 index 0000000000000..79fbc7f5133b4 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/gatsby-node.js @@ -0,0 +1,43 @@ +const path = require(`path`) + +const blogPost = path.resolve(`./src/templates/blog-post.js`) + +exports.createPages = async ({ graphql, actions }) => { + const { createPage } = actions + + const result = await graphql(` + query { + allMarkdownRemark { + nodes { + id + frontmatter { + slug + title # used in prev/next + } + } + } + } + `) + + if (result.errors) { + throw result.errors + } + + const posts = result.data.allMarkdownRemark.nodes + + posts.forEach(({ id, frontmatter: { slug } }, index) => { + const previous = index === posts.length - 1 ? null : posts[index + 1] + const next = index === 0 ? null : posts[index - 1] + + createPage({ + path: slug, + component: blogPost, + context: { + id, + slug, + previous, + next, + }, + }) + }) +} diff --git a/benchmarks/gabe-fs-markdown-images/gen.js b/benchmarks/gabe-fs-markdown-images/gen.js new file mode 100644 index 0000000000000..c2a90a0357405 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/gen.js @@ -0,0 +1,306 @@ +const fs = require("fs") +const path = require("path") +const faker = require(`faker`) +const genJpg = require("js-image-generator") +const rimraf = require("rimraf") +const ProgressBar = require("progress") + +const C = parseInt(process.env.C, 10) || 0 // Worker count. If non-zero, shards the image generation and generates N images regardless. +const N = parseInt(process.env.N, 10) || 100 // Article count +const W = parseInt(process.env.W, 10) || 640 // Image width +const H = parseInt(process.env.H, 10) || 326 // Image height + +let Worker, isMainThread, parentPort, workerData +try { + // worker_threads is node 10.15 ... + ;({ + Worker, + isMainThread, + parentPort, + workerData, + } = require("worker_threads")) +} catch (e) { + if (C > 0) { + console.log('') + console.warn( + "!! Worker threads are supported by nodejs from node 10.15 onwards. Proceeding in single thread mode. Consider upgrading nodejs. !!" + ) + console.log('') + } +} + +if (typeof Worker !== "undefined" && !isMainThread) { + const { offset, count, width, height } = workerData + const imgDir = "./generated_image_pools/jpg/" + width + "x" + height + console.log( + "Worker; generating", + count, + "images of", + width, + "x", + height, + ". From", + offset + ".jpg", + "to", + offset + count - 1 + ".jpg", + "into", + imgDir + ) + let i = 0 + function again() { + if (i >= count) { + // The end. + return + } + + genJpg.generateImage(width, height, 80, function (err, image) { + fs.writeFileSync(path.join(imgDir, offset + i + ".jpg"), image.data) + parentPort.postMessage(1) + }) + + ++i + setImmediate(again) + } + + // Need to do this async otherwise any postMessage after the first will be blocked + setImmediate(again) + + // This is valid in toplevel in nodejs. + return +} + +console.log("Start of gen") +console.time("End of gen") + +const imgDir = "./generated_image_pools/jpg/" + W + "x" + H + +if (!fs.existsSync("./generated_image_pools")) { + fs.mkdirSync("./generated_image_pools", { recursive: true }) +} +if (!fs.existsSync(imgDir)) { + fs.mkdirSync(imgDir, { recursive: true }) +} + +generateImagePool() + .then(generateArticles) + .then(() => { + console.timeEnd("End of gen") + console.log() + }) + .catch(e => { + throw new Error(e.stack) + }) + +function generateImagePool() { + // Image generation is quite expensive so rather than regenerate the images per run, we generate + // a static pool of images and copy from that to the correct position when needed. Takes up more + // space (not a concern in this context) but is a lot faster. + // It literally takes 10 minutes to generate single thread generate 1000 images of default dimensions, 2 hours for 128k of them. + + console.log( + "Making sure there are enough", + W, + "x", + H, + "jpg images in the pool" + ) + + if (C > 0 && typeof Worker !== "undefined") { + // Ignore existing images of this size and regenerate all of them + return forceRegenerateAllWithWorkers() + } else { + if (C > 0) { + console.log("") + console.log("RUNNING SINGLE CORE !! Ignoring `C` option because it requires a newer nodejs !! RUNNING SINGLE CORE") + console.log("") + } + // Assume existing images cover entire range 0 to count-1. Only generate count to N-1, single threaded + return incrementallyRegenerateNoWorkers() + } +} + +function forceRegenerateAllWithWorkers() { + rimraf.sync(imgDir) + fs.mkdirSync(imgDir, { recursive: true }) + + let step = Math.floor(N / C) + let lastStep = N - step * (C - 1) + + console.log( + "Sharing image generation across", + C, + "processes. Each process will generate", + step, + "images in", + imgDir + ) + + function worker(offset, count) { + return new Promise((resolve, reject) => { + const worker = new Worker(__filename, { + workerData: { + offset, + count, + width: W, + height: H, + }, + }) + worker.on("message", () => bar.tick()) + worker.on("error", reject) + worker.on("exit", code => { + if (code === 0) { + resolve() + } else { + reject(new Error(`Worker stopped with exit code ${code}`)) + } + }) + }) + } + + const workers = [] + for (let i = 0; i < C; ++i) { + workers.push(worker(i * step, i === C - 1 ? lastStep : step)) + } + + const bar = new ProgressBar( + `[:bar] :current/${N} | :percent | :elapsed sec | :rate /s | :eta secs remaining`, + { + total: N, + width: 30, + renderThrottle: 50, + } + ) + + return Promise.all(workers) +} + +function incrementallyRegenerateNoWorkers() { + const count = fs.readdirSync(imgDir).length + if (count === 0 && N > 1000) { + if (C === 0) { + console.log( + "Going to use one core for image generation. Consider using `C=4 W=" + + W + + " H=" + + H + + " N=" + + N + + " node gen.js` to spread the work over 4 workers (or whatever)." + ) + if (typeof Worker === "undefined") { + console.log( + "This also requires a newer verseion of nodejs (one that supports `worker_threads`)" + ) + } + } else { + console.log( + "This is going to be expensive. Consider using a different node version to generate the pool first." + ) + } + } else if (N - count > 1000) { + if (C === 0) { + console.log( + "Going to incrementally fill the pool by " + + (N - count) + + " images single threaded." + ) + console.log( + "Consider using `C=4 W=" + + W + + " H=" + + H + + " N=" + + N + + " node gen.js` to spread the work over 4 workers (or whatever)." + ) + } else { + console.log( + "This is going to be expensive. Consider using a different node version to regenerate the whole pool first." + ) + } + } + + const bar = new ProgressBar( + `[:bar] :current/${N} | :percent | :elapsed sec | :rate /s | :eta secs remaining`, + { + total: N, + width: 30, + renderThrottle: 100, + } + ) + + bar.tick(Math.min(N, count)) + + // This is a controlled environment. Assume that all existing files represent that many images. + // If N is larger than that, add that many images to the pool first. + for (let i = count; i < N; ++i) { + genJpg.generateImage(W, H, 80, function (err, image) { + fs.writeFileSync(path.join(imgDir, i + ".jpg"), image.data) + }) + bar.tick() + } + bar.terminate() + + // At this point the image dir should contain sufficient images to cover the articles + // Each image has random noise and should be named "i.jpg", with i from 0 through N-1 + + return Promise.resolve() +} + +function generateArticles() { + // Assuming there now exists a pool of images of given dimensions, generate an article and copy + // an image per article and give it the same name. + + console.log("Generating", N, "articles with one", W, "x", H, "jpg image") + + const bar = new ProgressBar( + `[:bar] :current/${N} | :percent | :elapsed sec | :rate /s | :eta secs remaining`, + { + total: N, + width: 30, + renderThrottle: 50, + } + ) + + rimraf.sync("./generated_articles") + rimraf.sync("./generated_images") + fs.mkdirSync("./generated_articles", { recursive: true }) + fs.mkdirSync("./generated_images", { recursive: true }) + + for (let i = 0; i < N; ++i) { + const sentence = faker.lorem.sentence() + const slug = faker.helpers.slugify(sentence).toLowerCase() + fs.writeFileSync( + path.join("./generated_articles", slug + ".md"), + createArticle(i, sentence, slug) + ) + fs.copyFileSync( + path.join(imgDir, i + ".jpg"), + path.join("./generated_images", slug + ".jpg") + ) + bar.tick() + } + bar.terminate() + + console.log("Finished preparing " + N + " articles") +} + +function createArticle(n, sentence, slug) { + const desc = faker.lorem.sentence() + + return `--- +articleNumber: ${n} +title: "${sentence.replace(/"/g, '\\"')}" +description: "${desc.replace(/"/g, '\\"')}" +slug: '${slug}' +date: ${faker.date.recent(1000).toISOString().slice(0, 10)} +rngImg: ../generated_images/${slug}.jpg +--- + +# ${sentence} + +> ${desc} + +${faker.lorem.paragraphs(2)} +` +} diff --git a/benchmarks/gabe-fs-markdown-images/package.json b/benchmarks/gabe-fs-markdown-images/package.json new file mode 100644 index 0000000000000..cb34279ef5e06 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/package.json @@ -0,0 +1,44 @@ +{ + "name": "gabe-fs-markdown", + "private": true, + "description": "Benchmark site for testing baseline markdown perf with individual files per page", + "author": "Peter van der Zee ", + "version": "0.1.0", + "license": "MIT", + "scripts": { + "bench": "rm -rf generated_articles generated_images; gatsby clean; N=${N:-512} node gen.js; CI=1 node --max_old_space_size=${M:-2}000 node_modules/.bin/gatsby build", + "build": "gatsby build", + "clean": "gatsby clean", + "develop": "gatsby develop", + "format": "prettier --write \"**/*.{js,jsx,json,md}\"" + }, + "devDependencies": { + "prettier": "2.0.4" + }, + "repository": { + "type": "git", + "url": "https://github.com/gatsbyjs/gatsby/tree/master/benchmarks/" + }, + "bugs": { + "url": "https://github.com/gatsbyjs/gatsby/issues" + }, + "keywords": [ + "gatsby", + "benchmark", + "markdown" + ], + "dependencies": { + "faker": "^4.1.0", + "gatsby": "2.31.0-next.0-dev-1610018045350", + "gatsby-plugin-image": "*", + "gatsby-plugin-sharp": "2.13.0-next.0-dev-1609845921133", + "gatsby-source-filesystem": "^2", + "gatsby-transformer-remark": "^2", + "gatsby-transformer-sharp": "2.11.0-next.0-dev-1609845921133", + "js-image-generator": "*", + "progress": "*", + "react": "^16.12.0", + "react-dom": "^16.12.0", + "rimraf": "*" + } +} diff --git a/benchmarks/gabe-fs-markdown-images/src/components/bio.js b/benchmarks/gabe-fs-markdown-images/src/components/bio.js new file mode 100644 index 0000000000000..867acfe818a21 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/src/components/bio.js @@ -0,0 +1,30 @@ +/** + * Bio component that queries for data + * with Gatsby's useStaticQuery component + * + * See: https://www.gatsbyjs.org/docs/use-static-query/ + */ + +import React from "react" + +const Bio = () => { + return ( +
+

+ Written by Bob who lives and works in Fan + Srancisco building useful things. + {` `} + + You should follow him on Twitter + +

+
+ ) +} + +export default Bio diff --git a/benchmarks/gabe-fs-markdown-images/src/components/layout.js b/benchmarks/gabe-fs-markdown-images/src/components/layout.js new file mode 100644 index 0000000000000..0fb3df2756467 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/src/components/layout.js @@ -0,0 +1,72 @@ +import React from "react" +import { Link } from "gatsby" + +class Layout extends React.Component { + render() { + const { location, title, children } = this.props + const rootPath = `${__PATH_PREFIX__}/` + let header + + if (location.pathname === rootPath) { + header = ( +

+ + {title} + +

+ ) + } else { + header = ( +

+ + {title} + +

+ ) + } + return ( +
+
{header}
+
{children}
+
+ © {new Date().getFullYear()}, Built with + {` `} + Gatsby +
+
+ ) + } +} + +export default Layout diff --git a/benchmarks/gabe-fs-markdown-images/src/pages/404.js b/benchmarks/gabe-fs-markdown-images/src/pages/404.js new file mode 100644 index 0000000000000..6380810248b0a --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/src/pages/404.js @@ -0,0 +1,30 @@ +import React from "react" +import { graphql } from "gatsby" + +import Layout from "../components/layout" + +class NotFoundPage extends React.Component { + render() { + const { data } = this.props + const siteTitle = data.site.siteMetadata.title + + return ( + +

Not Found

+

You just hit a route that doesn't exist... the sadness.

+
+ ) + } +} + +export default NotFoundPage + +export const pageQuery = graphql` + query { + site { + siteMetadata { + title + } + } + } +` diff --git a/benchmarks/gabe-fs-markdown-images/src/pages/index.js b/benchmarks/gabe-fs-markdown-images/src/pages/index.js new file mode 100644 index 0000000000000..5352a2b1d798a --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/src/pages/index.js @@ -0,0 +1,69 @@ +import React from "react" +import { Link, graphql } from "gatsby" + +import Bio from "../components/bio" +import Layout from "../components/layout" + +class BlogIndex extends React.Component { + render() { + const { data } = this.props + const siteTitle = data.site.siteMetadata.title + const posts = data.allMarkdownRemark.nodes + + return ( + + + {posts.map(({ frontmatter: { title, slug, date, description } }) => { + return ( +
+
+

+ + {title} + +

+ {date} +
+
+

+

+
+ ) + })} +
+ ) + } +} + +export default BlogIndex + +export const pageQuery = graphql` + query { + site { + siteMetadata { + title + } + } + allMarkdownRemark( + limit: 100 + sort: { fields: frontmatter___date, order: DESC } + ) { + nodes { + frontmatter { + title + slug + date(formatString: "MMMM DD, YYYY") + description + } + } + } + } +` diff --git a/benchmarks/gabe-fs-markdown-images/src/templates/blog-post.js b/benchmarks/gabe-fs-markdown-images/src/templates/blog-post.js new file mode 100644 index 0000000000000..e9c59d8d413b1 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/src/templates/blog-post.js @@ -0,0 +1,92 @@ +import React from "react" +import { Link, graphql } from "gatsby" + +import Bio from "../components/bio" +import Layout from "../components/layout" +import { GatsbyImage } from "gatsby-plugin-image" + +class BlogPostTemplate extends React.Component { + render() { + const { + html, + frontmatter: { + title, + date, + rngImg: { + childImageSharp: { gatsbyImageData }, + }, + }, + } = this.props.data.markdownRemark + const siteTitle = this.props.data.site.siteMetadata.title + const { previous, next } = this.props.pageContext + + return ( + +
+
+

{title}

+

{date}

+
+
+ +
+
+ +
+
+ + +
+ ) + } +} + +export default BlogPostTemplate + +export const pageQuery = graphql` + query BlogPostById($id: String!) { + site { + siteMetadata { + title + } + } + markdownRemark(id: { eq: $id }) { + html + frontmatter { + title + rngImg { + childImageSharp { + gatsbyImageData + # gatsbyImageData(layout: FIXED, width: 125, height: 125) + } + } + date(formatString: "MMMM DD, YYYY") + } + } + } +` diff --git a/benchmarks/gabe-fs-markdown-images/static/favicon.ico b/benchmarks/gabe-fs-markdown-images/static/favicon.ico new file mode 100644 index 0000000000000..85a4d9fac03ba Binary files /dev/null and b/benchmarks/gabe-fs-markdown-images/static/favicon.ico differ diff --git a/benchmarks/gabe-fs-markdown-images/static/robots.txt b/benchmarks/gabe-fs-markdown-images/static/robots.txt new file mode 100644 index 0000000000000..eb0536286f308 --- /dev/null +++ b/benchmarks/gabe-fs-markdown-images/static/robots.txt @@ -0,0 +1,2 @@ +User-agent: * +Disallow: diff --git a/docs/docs/how-to/adding-common-features/adding-search.md b/docs/docs/how-to/adding-common-features/adding-search.md index 98eeddaff7bc8..7431f9b1003de 100644 --- a/docs/docs/how-to/adding-common-features/adding-search.md +++ b/docs/docs/how-to/adding-common-features/adding-search.md @@ -2,66 +2,49 @@ title: Adding Search --- -See below for a list of guides in this section, or keep reading for an overview on adding search functionality to your site. - - - -## Site search overview - -Before going through the steps for adding search to your Gatsby website, examine the components needed for adding search to a website. - -There are three required components for adding search to your Gatsby website: - -1. index -2. engine -3. UI +There are three required components for adding search to your Gatsby website: the **search index**, the **search engine**, and **search UI**. ## Site search components -### Search index - -The search index is a copy of your data stored in a search-friendly format. An index is for optimizing speed and performance when executing a search query. Without an index, every search would need to scan every page in your site—which quickly becomes inefficient. - -### Search engine - -The search engine takes a search query, runs it through the search index, and returns any matching documents. - -### Search UI - -The UI component provides an interface to the user, which allows them to write search queries and view the results of each query. +| Search Component | Description | +| ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | +| **Search index** | The search index is a copy of your data stored in a search-friendly format. An index is for optimizing speed and performance when executing a search query. Without an index, every search would need to scan every page in your site—which quickly becomes inefficient. | +| **Search engine** | The search engine indexes your content, takes a search query, runs it through theindex, and returns any matching documents. Search engines can be hosted services (like Algolia) or open-source that you can self-host (like Elastic) | +| **Search UI** | A UI component on your site that allows users to write search queries and view the results of each query. Some search providers provide out of the box React components that you can drop into Gatsby sites. | | ## Adding search to your site -Now that you know the three required components, there are a few ways to approach adding search to your Gatsby-powered site. - -### Use an open source search engine +There are a few ways to approach adding search to your Gatsby-powered site. -Using an open source search engine is always free and allows you to enable offline search for your site. Note that you need to be careful with offline search because the entire search index has to be brought into the client, which can affect the bundle size significantly. +### Client-side search -Open source libraries like [`elasticlunr`](https://www.npmjs.com/package/elasticlunr), [`flexsearch`](https://github.com/nextapps-de/flexsearch) or [`js-search`](https://github.com/bvaughn/js-search) can be used to enable search for your site. +It is possible to do all the work in your Gatsby site without needing a third-party solution. This involves writing a bit of code, but using less services. With large amounts of content to index, it can also increase the bundle size significantly. -Doing so will require you to create a search index when your site is built. For [`elasticlunr`](https://www.npmjs.com/package/elasticlunr), there is a plugin called [`gatsby-plugin-elasticlunr-search`](https://github.com/gatsby-contrib/gatsby-plugin-elasticlunr-search) that creates a search index automatically. For [`flexsearch`](https://github.com/nextapps-de/flexsearch) there is a plugin called [`gatsby-plugin-flexsearch`](https://github.com/tmsss/gatsby-plugin-flexsearch). +One way of doing this is to use the `js-search` library: -For other libraries, you can use a combination of [`onCreateNode`](/docs/reference/config-files/gatsby-node/#onCreateNode), [`setFieldsOnGraphQLNodeType`](/docs/reference/config-files/gatsby-node/#setFieldsOnGraphQLNodeType) and [`sourceNodes`](/docs/reference/config-files/gatsby-node/#sourceNodes) from the Gatsby node API to create the search index and make it available in GraphQL. For more info on how to do this check out [`gatsby-plugin-elasticlunr-search`'s source code](https://github.com/gatsby-contrib/gatsby-plugin-elasticlunr-search/blob/master/src/gatsby-node.js#L96-L131). +- [Adding Search with JS Search](/docs/adding-search-with-js-search) -Another option is to generate the search index at the end of the build using the [`onPostBuild`](/docs/reference/config-files/gatsby-node/#onPostBuild) node API. This approach is used by [`gatsby-plugin-lunr`](https://github.com/humanseelabs/gatsby-plugin-lunr) to build a multilanguage index. +There are two Gatsby plugins that support this as well: -After building the search index and including it in Gatsby's data layer, you will need to allow the user to search your website. This is typically done by using a text input to capture the search query, then using one of the libraries mentioned above to retrieve the desired document(s). +- [gatsby-plugin-elasticlunr-search](/plugins/@gatsby-contrib/gatsby-plugin-elasticlunr-search) +- [gatsby-plugin-local-search](/plugins/gatsby-plugin-local-search) ### Use an API-based search engine Another option is to use an external search engine. This solution is much more scalable as visitors to your site don't have to download your entire search index (which becomes very large as your site grows) in order to search your site. The trade-off is you'll need to pay for hosting the search engine or pay for a commercial search service. -There are many available both open source that you can host yourself and commercial hosted options. +There are many options available, including both self-hosted and commercially hosted open source: - [ElasticSearch](https://www.elastic.co/products/elasticsearch) — OSS and has commercial hosting available - [Solr](http://lucene.apache.org/solr/) — OSS and has commercial hosting available - [Algolia](https://www.algolia.com/) — Commercial -If you're building a documentation website you can use [Algolia's DocSearch feature](https://community.algolia.com/docsearch/). It will automatically create a search index from the content of your pages. +Of these, the most common solution is Algolia. The Gatsby docs include a guide to adding Algolia to your site: + +- [Adding Search with Algolia](/docs/adding-search-with-algolia) -If your website does not qualify as documentation, you need to collect the search index at build time and upload it using [`gatsby-plugin-algolia`](https://github.com/algolia/gatsby-plugin-algolia). +When using Algolia, they host the search index and search engine for you. Your search queries will be sent to their servers which will respond with any results. For UI components, Algolia provides a [React library](https://github.com/algolia/react-instantsearch) has helpful components. -When using Algolia, they host the search index and search engine for you. Your search queries will be sent to their servers which will respond with any results. You'll need to implement your own UI; Algolia provides a [React library](https://github.com/algolia/react-instantsearch) which may have components you'd like to use. +If you're building a documentation website you can use [Algolia's DocSearch feature](https://community.algolia.com/docsearch/). It will automatically create a search index from the content of your pages. -Elasticsearch has several React component libraries for search e.g. https://github.com/appbaseio/reactivesearch +Elasticsearch also has several React component libraries for search, such as [ReactiveSearch](https://github.com/appbaseio/reactivesearch) diff --git a/docs/docs/how-to/styling/other-css-frameworks.md b/docs/docs/how-to/styling/other-css-frameworks.md index e5fb5d09d712a..24e19164ad0fb 100644 --- a/docs/docs/how-to/styling/other-css-frameworks.md +++ b/docs/docs/how-to/styling/other-css-frameworks.md @@ -37,11 +37,11 @@ Chakra UI is built on top of the [Emotion styling library](/docs/how-to/styling/ Chakra UI provides a library of components, and it comes with dark mode out of the box. It also has a theme object which you can use to customize your site's color palette, typography, breakpoints, and more. -If you're interested in using Chakra UI, check out the [`gatsby-plugin-chakra-ui` documentation](/plugins/gatsby-plugin-chakra-ui/?=chakra). +If you're interested in using Chakra UI, check out the [`@chakra-ui/gatsby-plugin` documentation](/plugins/@chakra-ui/gatsby-plugin/). - [Chakra UI documentation](https://chakra-ui.com/getting-started) - [Chakra UI repo on GitHub](https://github.com/chakra-ui/chakra-ui/) -- [Setting Up Chakra UI in a GatsbyJS App (YouTube)](https://www.youtube.com/watch?v=PjQHqDWnzGw) +- [Chakra UI and Gatsby - Getting Started (YouTube)](https://www.youtube.com/watch?v=hXM9Ju_NIpU) ## Grommet diff --git a/docs/docs/tutorial/part-two/css-modules-1.png b/docs/docs/tutorial/part-two/css-modules-1.png deleted file mode 100644 index 5fa62487c25d8..0000000000000 Binary files a/docs/docs/tutorial/part-two/css-modules-1.png and /dev/null differ diff --git a/docs/docs/tutorial/part-two/css-modules-final.png b/docs/docs/tutorial/part-two/css-modules-final.png deleted file mode 100644 index 657bc7dc54afd..0000000000000 Binary files a/docs/docs/tutorial/part-two/css-modules-final.png and /dev/null differ diff --git a/docs/docs/tutorial/part-two/css-modules-userlist.png b/docs/docs/tutorial/part-two/css-modules-userlist.png index 43b958c616fdb..438c609f0b6d0 100644 Binary files a/docs/docs/tutorial/part-two/css-modules-userlist.png and b/docs/docs/tutorial/part-two/css-modules-userlist.png differ diff --git a/docs/docs/tutorial/part-two/glamor-example.png b/docs/docs/tutorial/part-two/glamor-example.png deleted file mode 100644 index 5f8ce6d917a8e..0000000000000 Binary files a/docs/docs/tutorial/part-two/glamor-example.png and /dev/null differ diff --git a/docs/docs/tutorial/part-two/index.md b/docs/docs/tutorial/part-two/index.md index 8dea79b6c670a..e269de0baf71e 100644 --- a/docs/docs/tutorial/part-two/index.md +++ b/docs/docs/tutorial/part-two/index.md @@ -285,14 +285,14 @@ export default function About() {

CSS Modules are cool

{/* highlight-start */} {/* highlight-end */} diff --git a/docs/docs/tutorial/part-two/pexels-daniel-xavier-1102341.jpg b/docs/docs/tutorial/part-two/pexels-daniel-xavier-1102341.jpg new file mode 100644 index 0000000000000..8cb790b660af9 Binary files /dev/null and b/docs/docs/tutorial/part-two/pexels-daniel-xavier-1102341.jpg differ diff --git a/docs/docs/tutorial/part-two/pexels-guilherme-almeida-1858175.jpg b/docs/docs/tutorial/part-two/pexels-guilherme-almeida-1858175.jpg new file mode 100644 index 0000000000000..c7cadb729b3b3 Binary files /dev/null and b/docs/docs/tutorial/part-two/pexels-guilherme-almeida-1858175.jpg differ diff --git a/docs/docs/tutorial/part-two/typography-bootstrap.png b/docs/docs/tutorial/part-two/typography-bootstrap.png deleted file mode 100644 index f33b9fa84a154..0000000000000 Binary files a/docs/docs/tutorial/part-two/typography-bootstrap.png and /dev/null differ diff --git a/docs/docs/tutorial/part-two/typography-lawton.png b/docs/docs/tutorial/part-two/typography-lawton.png deleted file mode 100644 index 9e105f917abcb..0000000000000 Binary files a/docs/docs/tutorial/part-two/typography-lawton.png and /dev/null differ diff --git a/e2e-tests/development-runtime/cypress/integration/eslint-rules/limited-exports-page-templates.js b/e2e-tests/development-runtime/cypress/integration/eslint-rules/limited-exports-page-templates.js new file mode 100644 index 0000000000000..3464d8de60a7a --- /dev/null +++ b/e2e-tests/development-runtime/cypress/integration/eslint-rules/limited-exports-page-templates.js @@ -0,0 +1,14 @@ +if (Cypress.env("HOT_LOADER") === `fast-refresh`) { + describe(`limited-exports-page-templates`, () => { + it(`should log warning to console for invalid export`, () => { + cy.visit(`/eslint-rules/limited-exports-page-templates`, { + onBeforeLoad(win) { + cy.stub(win.console, 'log').as(`consoleLog`) + } + }).waitForRouteChange() + + cy.get(`@consoleLog`).should(`be.calledWithMatch`, /15:1 warning In page templates only a default export of a valid React component and the named export of a page query is allowed./i) + cy.get(`@consoleLog`).should(`not.be.calledWithMatch`, /17:1 warning In page templates only a default export of a valid React component and the named export of a page query is allowed./i) + }) + }) +} diff --git a/e2e-tests/development-runtime/cypress/integration/eslint-rules/no-anonymous-exports-page-templates.js b/e2e-tests/development-runtime/cypress/integration/eslint-rules/no-anonymous-exports-page-templates.js new file mode 100644 index 0000000000000..53aacb74fea8b --- /dev/null +++ b/e2e-tests/development-runtime/cypress/integration/eslint-rules/no-anonymous-exports-page-templates.js @@ -0,0 +1,22 @@ +if (Cypress.env("HOT_LOADER") === `fast-refresh`) { + describe(`no-anonymous-exports-page-templates`, () => { + it(`should log warning to console for arrow functions`, () => { + cy.visit(`/eslint-rules/no-anonymous-exports-page-templates`, { + onBeforeLoad(win) { + cy.stub(win.console, 'log').as(`consoleLog`) + } + }).waitForRouteChange() + + cy.get(`@consoleLog`).should(`be.calledWithMatch`, /Anonymous arrow functions cause Fast Refresh to not preserve local component state./i) + }) + it(`should log warning to console for function declarations`, () => { + cy.visit(`/eslint-rules/no-anonymous-exports-page-templates-function`, { + onBeforeLoad(win) { + cy.stub(win.console, 'log').as(`consoleLog`) + } + }).waitForRouteChange() + + cy.get(`@consoleLog`).should(`be.calledWithMatch`, /Anonymous function declarations cause Fast Refresh to not preserve local component state./i) + }) + }) +} diff --git a/e2e-tests/development-runtime/cypress/integration/functionality/implicit-fragments.js b/e2e-tests/development-runtime/cypress/integration/functionality/implicit-fragments.js new file mode 100644 index 0000000000000..06be28e2ecdea --- /dev/null +++ b/e2e-tests/development-runtime/cypress/integration/functionality/implicit-fragments.js @@ -0,0 +1,15 @@ +const testQueryString = `?query=${encodeURIComponent(`{ + site { + ...TestingFragment + } +}`)}` + +describe(`The GraphQL endpoint`, () => { + it(`Should execute operations with implicit fragments`, () => { + // prefill query from query string + cy.visit(`/___graphql` + testQueryString) + cy.get(`.graphiql-container`).should(`be.visible`) + cy.get(`.execute-button`).click() + cy.get(`.result-window .CodeMirror-code`).contains(`@gatsbyjs`) + }) +}) diff --git a/e2e-tests/development-runtime/src/pages/eslint-rules/limited-exports-page-templates.js b/e2e-tests/development-runtime/src/pages/eslint-rules/limited-exports-page-templates.js new file mode 100644 index 0000000000000..75a40504bb908 --- /dev/null +++ b/e2e-tests/development-runtime/src/pages/eslint-rules/limited-exports-page-templates.js @@ -0,0 +1,27 @@ +import React from "react" +import { graphql } from "gatsby" + +function PageQuery({ data }) { + return ( +
+

Limited Exports Page Templates. ESLint Rule

+

+ {data.site.siteMetadata.title} +

+
+ ) +} + +export function notAllowed() {} + +export const query = graphql` + { + site { + siteMetadata { + title + } + } + } +` + +export default PageQuery diff --git a/e2e-tests/development-runtime/src/pages/eslint-rules/no-anonymous-exports-page-templates-function.js b/e2e-tests/development-runtime/src/pages/eslint-rules/no-anonymous-exports-page-templates-function.js new file mode 100644 index 0000000000000..e7ef2e9fbd5a1 --- /dev/null +++ b/e2e-tests/development-runtime/src/pages/eslint-rules/no-anonymous-exports-page-templates-function.js @@ -0,0 +1,11 @@ +import React from "react" + +import Layout from "../../components/layout" + +export default function () { + return ( + +

Anonymous Arrow Function. ESLint Rule

+
+ ) +} diff --git a/e2e-tests/development-runtime/src/pages/eslint-rules/no-anonymous-exports-page-templates.js b/e2e-tests/development-runtime/src/pages/eslint-rules/no-anonymous-exports-page-templates.js new file mode 100644 index 0000000000000..4378c7bbcb324 --- /dev/null +++ b/e2e-tests/development-runtime/src/pages/eslint-rules/no-anonymous-exports-page-templates.js @@ -0,0 +1,9 @@ +import React from "react" + +import Layout from "../../components/layout" + +export default () => ( + +

Anonymous Arrow Function. ESLint Rule

+
+) diff --git a/e2e-tests/development-runtime/src/utils/fragments.js b/e2e-tests/development-runtime/src/utils/fragments.js new file mode 100644 index 0000000000000..58ba6f48725d0 --- /dev/null +++ b/e2e-tests/development-runtime/src/utils/fragments.js @@ -0,0 +1,9 @@ +import { graphql } from "gatsby" + +export const TestingFragment = graphql` + fragment TestingFragment on Site { + siteMetadata { + author + } + } +` diff --git a/e2e-tests/visual-regression/src/pages/images/fullWidth.js b/e2e-tests/visual-regression/src/pages/images/fullWidth.js index 010a3a5259131..9609bbd807020 100644 --- a/e2e-tests/visual-regression/src/pages/images/fullWidth.js +++ b/e2e-tests/visual-regression/src/pages/images/fullWidth.js @@ -9,7 +9,7 @@ const Page = () => { query { file(relativePath: { eq: "cornwall.jpg" }) { childImageSharp { - gatsbyImageData(width: 1024, layout: FULL_WIDTH) + gatsbyImageData(layout: FULL_WIDTH) } } } diff --git a/e2e-tests/visual-regression/src/pages/static-images/fullWidth.js b/e2e-tests/visual-regression/src/pages/static-images/fullWidth.js index 99fb1ca0a7834..1657f7415ff8c 100644 --- a/e2e-tests/visual-regression/src/pages/static-images/fullWidth.js +++ b/e2e-tests/visual-regression/src/pages/static-images/fullWidth.js @@ -12,7 +12,6 @@ const Page = () => { src="../../images/cornwall.jpg" loading="eager" layout="fullWidth" - width={1024} alt="cornwall" /> diff --git a/package.json b/package.json index b19165c818987..111227406961e 100644 --- a/package.json +++ b/package.json @@ -90,7 +90,7 @@ "ts-jest": "^22", "typescript": "^3.9.7", "unified": "^9.2.0", - "yargs": "^10.1.2" + "yargs": "^15.4.1" }, "resolutions": { "theme-ui": "0.4.0-rc.14", diff --git a/packages/babel-plugin-remove-graphql-queries/CHANGELOG.md b/packages/babel-plugin-remove-graphql-queries/CHANGELOG.md index de944899e235f..9a539e8ee8001 100644 --- a/packages/babel-plugin-remove-graphql-queries/CHANGELOG.md +++ b/packages/babel-plugin-remove-graphql-queries/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.16.0-next.0](https://github.com/gatsbyjs/gatsby/compare/babel-plugin-remove-graphql-queries@2.15.0-next.0...babel-plugin-remove-graphql-queries@2.16.0-next.0) (2021-01-18) + +**Note:** Version bump only for package babel-plugin-remove-graphql-queries + # [2.15.0-next.0](https://github.com/gatsbyjs/gatsby/compare/babel-plugin-remove-graphql-queries@2.14.0-next.0...babel-plugin-remove-graphql-queries@2.15.0-next.0) (2020-12-29) **Note:** Version bump only for package babel-plugin-remove-graphql-queries diff --git a/packages/babel-plugin-remove-graphql-queries/package.json b/packages/babel-plugin-remove-graphql-queries/package.json index 3597f262818ec..5b9ab40d79ab1 100644 --- a/packages/babel-plugin-remove-graphql-queries/package.json +++ b/packages/babel-plugin-remove-graphql-queries/package.json @@ -1,6 +1,6 @@ { "name": "babel-plugin-remove-graphql-queries", - "version": "2.15.0-next.0", + "version": "2.16.0-next.0", "author": "Jason Quense ", "repository": { "type": "git", @@ -11,7 +11,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "peerDependencies": { diff --git a/packages/babel-preset-gatsby-package/CHANGELOG.md b/packages/babel-preset-gatsby-package/CHANGELOG.md index d8500b53ed6a3..988070993b06b 100644 --- a/packages/babel-preset-gatsby-package/CHANGELOG.md +++ b/packages/babel-preset-gatsby-package/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.12.0-next.0](https://github.com/gatsbyjs/gatsby/compare/babel-preset-gatsby-package@0.11.0-next.0...babel-preset-gatsby-package@0.12.0-next.0) (2021-01-18) + +**Note:** Version bump only for package babel-preset-gatsby-package + # [0.11.0-next.0](https://github.com/gatsbyjs/gatsby/compare/babel-preset-gatsby-package@0.10.0-next.0...babel-preset-gatsby-package@0.11.0-next.0) (2020-12-29) **Note:** Version bump only for package babel-preset-gatsby-package diff --git a/packages/babel-preset-gatsby-package/package.json b/packages/babel-preset-gatsby-package/package.json index 994f2ab345b59..b31ee0279b763 100644 --- a/packages/babel-preset-gatsby-package/package.json +++ b/packages/babel-preset-gatsby-package/package.json @@ -1,6 +1,6 @@ { "name": "babel-preset-gatsby-package", - "version": "0.11.0-next.0", + "version": "0.12.0-next.0", "author": "Philipp Spiess ", "repository": { "type": "git", diff --git a/packages/babel-preset-gatsby/CHANGELOG.md b/packages/babel-preset-gatsby/CHANGELOG.md index 98e9610e7cb3c..68c5d1d055d46 100644 --- a/packages/babel-preset-gatsby/CHANGELOG.md +++ b/packages/babel-preset-gatsby/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.12.0-next.0](https://github.com/gatsbyjs/gatsby/compare/babel-preset-gatsby@0.11.0-next.0...babel-preset-gatsby@0.12.0-next.0) (2021-01-18) + +**Note:** Version bump only for package babel-preset-gatsby + # [0.11.0-next.0](https://github.com/gatsbyjs/gatsby/compare/babel-preset-gatsby@0.10.0-next.1...babel-preset-gatsby@0.11.0-next.0) (2020-12-29) **Note:** Version bump only for package babel-preset-gatsby diff --git a/packages/babel-preset-gatsby/package.json b/packages/babel-preset-gatsby/package.json index 4924a69044e22..b6e6c0b054c32 100644 --- a/packages/babel-preset-gatsby/package.json +++ b/packages/babel-preset-gatsby/package.json @@ -1,6 +1,6 @@ { "name": "babel-preset-gatsby", - "version": "0.11.0-next.0", + "version": "0.12.0-next.0", "author": "Philipp Spiess ", "repository": { "type": "git", @@ -21,8 +21,8 @@ "babel-plugin-dynamic-import-node": "^2.3.3", "babel-plugin-macros": "^2.8.0", "babel-plugin-transform-react-remove-prop-types": "^0.4.24", - "gatsby-core-utils": "^1.9.0-next.0", - "gatsby-legacy-polyfills": "^0.6.0-next.0" + "gatsby-core-utils": "^1.10.0-next.0", + "gatsby-legacy-polyfills": "^0.7.0-next.0" }, "peerDependencies": { "@babel/core": "^7.11.6", @@ -37,7 +37,7 @@ }, "devDependencies": { "@babel/cli": "^7.12.1", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3", "slash": "^3.0.0" }, diff --git a/packages/create-gatsby/CHANGELOG.md b/packages/create-gatsby/CHANGELOG.md index b0e9145c600c1..873d7c619f224 100644 --- a/packages/create-gatsby/CHANGELOG.md +++ b/packages/create-gatsby/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.5.0-next.0](https://github.com/gatsbyjs/gatsby/compare/create-gatsby@0.4.0-next.1...create-gatsby@0.5.0-next.0) (2021-01-18) + +**Note:** Version bump only for package create-gatsby + # [0.4.0-next.1](https://github.com/gatsbyjs/gatsby/compare/create-gatsby@0.4.0-next.0...create-gatsby@0.4.0-next.1) (2021-01-12) **Note:** Version bump only for package create-gatsby diff --git a/packages/create-gatsby/package.json b/packages/create-gatsby/package.json index f04ac8c5899ef..cdc6697daba42 100644 --- a/packages/create-gatsby/package.json +++ b/packages/create-gatsby/package.json @@ -1,6 +1,6 @@ { "name": "create-gatsby", - "version": "0.4.0-next.1", + "version": "0.5.0-next.0", "main": "lib/index.js", "bin": "cli.js", "license": "MIT", @@ -27,7 +27,7 @@ "eslint": "^7.17.0", "execa": "^4.1.0", "fs-extra": "^9.0.1", - "gatsby-plugin-utils": "^0.8.0-next.1", + "gatsby-plugin-utils": "^0.9.0-next.0", "joi": "^17.2.1", "microbundle": "^0.12.4", "node-fetch": "^2.6.1", diff --git a/packages/gatsby-admin/CHANGELOG.md b/packages/gatsby-admin/CHANGELOG.md index eec38108767f9..207fd4c372aa2 100644 --- a/packages/gatsby-admin/CHANGELOG.md +++ b/packages/gatsby-admin/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. +# [0.8.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-admin@0.7.0-next.1...gatsby-admin@0.8.0-next.0) (2021-01-18) + +### Bug Fixes + +- **security:** update vulnerable packages, include React 17 in peerDeps ([#28545](https://github.com/gatsbyjs/gatsby/issues/28545)) ([18b5f30](https://github.com/gatsbyjs/gatsby/commit/18b5f30e367895aa5f3af46e4989b347912a0f35)) + # [0.7.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-admin@0.7.0-next.0...gatsby-admin@0.7.0-next.1) (2021-01-12) ### Bug Fixes diff --git a/packages/gatsby-admin/package.json b/packages/gatsby-admin/package.json index 2aff761b47431..957e92b000d7a 100644 --- a/packages/gatsby-admin/package.json +++ b/packages/gatsby-admin/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-admin", - "version": "0.7.0-next.1", + "version": "0.8.0-next.0", "main": "index.js", "author": "Max Stoiber", "license": "MIT", @@ -20,11 +20,11 @@ "@typescript-eslint/parser": "^2.34.0", "csstype": "^2.6.13", "formik": "^2.2.5", - "gatsby": "^2.31.0-next.1", + "gatsby": "^2.32.0-next.0", "gatsby-interface": "^0.0.225", - "gatsby-plugin-typescript": "^2.11.0-next.0", - "gatsby-plugin-webfonts": "^1.1.3", - "gatsby-source-graphql": "^2.13.0-next.0", + "gatsby-plugin-typescript": "^2.12.0-next.0", + "gatsby-plugin-webfonts": "^1.1.4", + "gatsby-source-graphql": "^2.14.0-next.0", "lodash-es": "^4.17.20", "ncp": "^2.0.0", "nodemon": "^2.0.6", diff --git a/packages/gatsby-cli/CHANGELOG.md b/packages/gatsby-cli/CHANGELOG.md index e2073da6e32ad..0918ca82c9589 100644 --- a/packages/gatsby-cli/CHANGELOG.md +++ b/packages/gatsby-cli/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.19.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-cli@2.18.0-next.1...gatsby-cli@2.19.0-next.0) (2021-01-18) + +### Bug Fixes + +- **security:** update vulnerable packages, include React 17 in peerDeps ([#28545](https://github.com/gatsbyjs/gatsby/issues/28545)) ([18b5f30](https://github.com/gatsbyjs/gatsby/commit/18b5f30e367895aa5f3af46e4989b347912a0f35)) + # [2.18.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-cli@2.18.0-next.0...gatsby-cli@2.18.0-next.1) (2021-01-12) ### Bug Fixes diff --git a/packages/gatsby-cli/package.json b/packages/gatsby-cli/package.json index 7970fa948d71b..6d3ef8ce60369 100644 --- a/packages/gatsby-cli/package.json +++ b/packages/gatsby-cli/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-cli", "description": "Gatsby command-line interface for creating new sites and running Gatsby commands", - "version": "2.18.0-next.1", + "version": "2.19.0-next.0", "author": "Kyle Mathews ", "bin": { "gatsby": "cli.js" @@ -19,14 +19,14 @@ "common-tags": "^1.8.0", "configstore": "^5.0.1", "convert-hrtime": "^3.0.0", - "create-gatsby": "^0.4.0-next.1", + "create-gatsby": "^0.5.0-next.0", "envinfo": "^7.7.3", "execa": "^3.4.0", "fs-exists-cached": "^1.0.0", "fs-extra": "^8.1.0", - "gatsby-core-utils": "^1.9.0-next.0", - "gatsby-recipes": "^0.8.0-next.1", - "gatsby-telemetry": "^1.9.0-next.1", + "gatsby-core-utils": "^1.10.0-next.0", + "gatsby-recipes": "^0.9.0-next.0", + "gatsby-telemetry": "^1.10.0-next.0", "hosted-git-info": "^3.0.6", "is-valid-path": "^0.1.1", "lodash": "^4.17.20", @@ -47,7 +47,7 @@ "uuid": "3.4.0", "yargs": "^15.4.1", "yoga-layout-prebuilt": "^1.9.6", - "yurnalist": "^1.1.2" + "yurnalist": "^2.1.0" }, "devDependencies": { "@babel/cli": "^7.12.1", @@ -59,7 +59,7 @@ "@rollup/plugin-replace": "^2.3.3", "@types/hosted-git-info": "^3.0.1", "@types/yargs": "^15.0.8", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3", "ink": "^3.0.8", "ink-spinner": "^4.0.1", diff --git a/packages/gatsby-codemods/CHANGELOG.md b/packages/gatsby-codemods/CHANGELOG.md index 78dee20bd5693..2256b76df7444 100644 --- a/packages/gatsby-codemods/CHANGELOG.md +++ b/packages/gatsby-codemods/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. +# [1.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-codemods@1.9.0-next.0...gatsby-codemods@1.10.0-next.0) (2021-01-18) + +### Features + +- **gatsby-codemods:** Handle or warn on nested options changes ([#29046](https://github.com/gatsbyjs/gatsby/issues/29046)) ([2439b44](https://github.com/gatsbyjs/gatsby/commit/2439b4440e7c756ae6c09b0e854c91b484d9a462)) + # [1.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-codemods@1.8.0-next.0...gatsby-codemods@1.9.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-codemods diff --git a/packages/gatsby-codemods/package.json b/packages/gatsby-codemods/package.json index 2c7ae3890df82..c1ffef941bf69 100644 --- a/packages/gatsby-codemods/package.json +++ b/packages/gatsby-codemods/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-codemods", - "version": "1.9.0-next.0", + "version": "1.10.0-next.0", "description": "A collection of codemod scripts for use with JSCodeshift that help migrate to newer versions of Gatsby.", "main": "index.js", "scripts": { @@ -36,7 +36,7 @@ }, "devDependencies": { "@babel/cli": "^7.12.1", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "engines": { diff --git a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/call-expression.output.js b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/call-expression.output.js index 2c6d6c0b60a59..ed7186133bfae 100644 --- a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/call-expression.output.js +++ b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/call-expression.output.js @@ -1,7 +1,7 @@ const result = graphql(`{ file(relativePath: {eq: "headers/headshot.jpg"}) { childImageSharp { - gatsbyImageData(layout: FLUID) + gatsbyImageData(layout: FULL_WIDTH) } } } diff --git a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/fluid.input.js b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/fluid.input.js new file mode 100644 index 0000000000000..2985e4f924de6 --- /dev/null +++ b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/fluid.input.js @@ -0,0 +1,24 @@ +import React from "react" +import { graphql } from "gatsby" +import Img from "gatsby-image" + +headshot + +export const query = graphql` +{ + file(relativePath: { eq: "headers/default.jpg" }) { + childImageSharp { + fluid(maxWidth: 1000, maxHeight: 500) { + ...GatsbyImageSharpFluid + } + } + } + other: file(relativePath: { eq: "headers/default.jpg" }) { + childImageSharp { + fluid(maxWidth: 500) { + ...GatsbyImageSharpFluid + } + } + } +} +` \ No newline at end of file diff --git a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/fluid.output.js b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/fluid.output.js new file mode 100644 index 0000000000000..f1cf4686654ef --- /dev/null +++ b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/fluid.output.js @@ -0,0 +1,19 @@ +import React from "react" +import { graphql } from "gatsby" +import { GatsbyImage } from "gatsby-plugin-image"; + + + +export const query = graphql`{ + file(relativePath: {eq: "headers/default.jpg"}) { + childImageSharp { + gatsbyImageData(layout: FULL_WIDTH) + } + } + other: file(relativePath: {eq: "headers/default.jpg"}) { + childImageSharp { + gatsbyImageData(width: 500, layout: CONSTRAINED) + } + } +} +` diff --git a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/multiple.output.js b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/multiple.output.js index 673faa71d4e51..1826818eea0f8 100644 --- a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/multiple.output.js +++ b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/multiple.output.js @@ -11,7 +11,7 @@ import { GatsbyImage } from "gatsby-plugin-image"; export const query = graphql`{ file(relativePath: {eq: "headers/headshot.jpg"}) { childImageSharp { - gatsbyImageData(layout: FLUID) + gatsbyImageData(layout: FULL_WIDTH) } } banner: file(relativePath: {eq: "headers/default.jpg"}) { diff --git a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/placeholders.output.js b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/placeholders.output.js index 1ac432f5d041c..0b2e7b73c7f0e 100644 --- a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/placeholders.output.js +++ b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/placeholders.output.js @@ -8,7 +8,7 @@ import { GatsbyImage } from "gatsby-plugin-image"; export const query = graphql`{ named: file(relativePath: {eq: "landscape.jpg"}) { childImageSharp { - gatsbyImageData(placeholder: TRACED_SVG, layout: FLUID) + gatsbyImageData(placeholder: TRACED_SVG, layout: FULL_WIDTH) } } } diff --git a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/transform-options.input.js b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/transform-options.input.js new file mode 100644 index 0000000000000..b1ee08406a7ba --- /dev/null +++ b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/transform-options.input.js @@ -0,0 +1,14 @@ +import React from "react" +import { graphql } from "gatsby" + +export const query = graphql` +{ + file(relativePath: {eq: "icon.png"}) { + childImageSharp { + fluid(duotone: {highlight: "#f00e2e", shadow: "#192550"}, rotate: 50) { + ...GatsbyImageSharpFluid + } + } + } +} +` \ No newline at end of file diff --git a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/transform-options.output.js b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/transform-options.output.js new file mode 100644 index 0000000000000..d8c9554aab3a7 --- /dev/null +++ b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/transform-options.output.js @@ -0,0 +1,11 @@ +import React from "react" +import { graphql } from "gatsby" + +export const query = graphql`{ + file(relativePath: {eq: "icon.png"}) { + childImageSharp { + gatsbyImageData(transformOptions: {duotone: {highlight: "#f00e2e", shadow: "#192550"}, rotate: 50}, layout: FULL_WIDTH) + } + } +} +` \ No newline at end of file diff --git a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/typescript.output.tsx b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/typescript.output.tsx index e35175da0c5e8..65ed2bc538890 100644 --- a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/typescript.output.tsx +++ b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/typescript.output.tsx @@ -5,7 +5,7 @@ export const Hero: React.SFC = ({ children }) => { const data = useStaticQuery(graphql`{ file(relativePath: {eq: "banner.jpg"}) { childImageSharp { - gatsbyImageData(layout: FLUID) + gatsbyImageData(layout: FULL_WIDTH) } } } diff --git a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/variable-src.input.js b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/variable-src.input.js new file mode 100644 index 0000000000000..d4921ea594b7f --- /dev/null +++ b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/variable-src.input.js @@ -0,0 +1,4 @@ +import Img from "gatsby-image" +const HomePage = ({ data }) => { + const image = data.file.childImageSharp.fluid.src +} \ No newline at end of file diff --git a/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/variable-src.output.js b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/variable-src.output.js new file mode 100644 index 0000000000000..f6278f0083d6c --- /dev/null +++ b/packages/gatsby-codemods/src/transforms/__testfixtures__/gatsby-plugin-image/variable-src.output.js @@ -0,0 +1,4 @@ +import { GatsbyImage } from "gatsby-plugin-image"; +const HomePage = ({ data }) => { + const image = data.file.childImageSharp.gatsbyImageData.src +} \ No newline at end of file diff --git a/packages/gatsby-codemods/src/transforms/__tests__/gatsby-plugin-image-test.js b/packages/gatsby-codemods/src/transforms/__tests__/gatsby-plugin-image-test.js index 56b6b3e3eae53..e171bea295724 100644 --- a/packages/gatsby-codemods/src/transforms/__tests__/gatsby-plugin-image-test.js +++ b/packages/gatsby-codemods/src/transforms/__tests__/gatsby-plugin-image-test.js @@ -17,6 +17,9 @@ const tests = [ `stunted-ref`, `optional-chaining`, `styled`, + `fluid`, + `transform-options`, + `variable-src`, ] const defineTest = require(`jscodeshift/dist/testUtils`).defineTest diff --git a/packages/gatsby-codemods/src/transforms/gatsby-plugin-image.js b/packages/gatsby-codemods/src/transforms/gatsby-plugin-image.js index c15cdbef96559..cbd96f2778297 100644 --- a/packages/gatsby-codemods/src/transforms/gatsby-plugin-image.js +++ b/packages/gatsby-codemods/src/transforms/gatsby-plugin-image.js @@ -25,9 +25,25 @@ const legacyFragmentsSVGPlaceholder = [ `GatsbyImageSharpFluid_withWebp_tracedSVG`, ] +const transformOptions = [ + `grayscale`, + `duotone`, + `rotate`, + `trim`, + `cropFocus`, + `fit`, +] + +const otherOptions = [ + `jpegQuality`, + `webpQuality`, + `pngQuality`, + `pngCompressionSpeed`, +] + const typeMapper = { fixed: `FIXED`, - fluid: `FLUID`, + fluid: `FULL_WIDTH`, constrained: `CONSTRAINED`, } @@ -122,6 +138,14 @@ export function updateImport(babel) { propNames.includes(path.node.property.name) && path.node?.object?.property?.name === `childImageSharp` ) { + if ( + t.isMemberExpression(path.parent) || + t.isOptionalMemberExpression(path.parent) + ) { + console.log( + `It appears you're accessing src or similar. This structure has changed. Please inspect ${state.opts.filename} manually, you likely want to use a helper function like getSrc.` + ) + } const updatedExpression = t.memberExpression( path.node.object, t.identifier(`gatsbyImageData`) @@ -135,6 +159,14 @@ export function updateImport(babel) { propNames.includes(path.node.property.name) && path.node?.object?.property?.name === `childImageSharp` ) { + if ( + t.isMemberExpression(path.parent) || + t.isOptionalMemberExpression(path.parent) + ) { + console.log( + `It appears you're accessing src or similar. This structure has changed. Please inspect ${state.opts.filename} manually, you likely want to use a helper function like getSrc.` + ) + } const updatedExpression = t.optionalMemberExpression( path.node.object, t.identifier(`gatsbyImageData`), @@ -154,7 +186,7 @@ export function updateImport(babel) { const { ast: transformedGraphQLQuery, hasChanged, - } = processGraphQLQuery(query) + } = processGraphQLQuery(query, state) if (hasChanged) { node.quasi.quasis[0].value.raw = graphql.print( @@ -174,7 +206,7 @@ export function updateImport(babel) { const { ast: transformedGraphQLQuery, hasChanged, - } = processGraphQLQuery(query) + } = processGraphQLQuery(query, state) if (hasChanged) { node.arguments[0].quasis[0].value.raw = graphql.print( @@ -251,19 +283,9 @@ function processImportUsage(path, t, template, state) { newImageExpression.extra.parenthesized = false // the template adds parens and we don't want it to } else if (t.isObjectExpression(expressionValue)) { - expressionValue.properties.map(item => { - if (item.key?.name !== `src`) return - if (t.isMemberExpression(item.value)) { - let subObject = item.value?.object - while (subObject) { - if (propNames.includes(subObject.property?.name)) { - subObject.property.name = `gatsbyImageData` - break - } - subObject = subObject?.object - } - } - }) + console.log( + `It appears you're passing src or srcSet directly. This API is no longer exposed, please update ${state.opts.filename} manually.` + ) } else if (expressionValue) { console.log( `It appears you're passing a variable to your image component. We haven't changed it, but we have updated it to use the new GatsbyImage component. Please check ${state.opts.filename} manually.` @@ -286,7 +308,7 @@ function processImportUsage(path, t, template, state) { path.skip() // prevent us from revisiting these nodes } -function processArguments(queryArguments, fragment) { +function processArguments(queryArguments, fragment, layout, state) { if (!legacyFragments.includes(fragment.name.value)) { let placeholderEnum = `BLURRED` // just in case these aren't the discrete cases we expect if (legacyFragmentsNoPlaceholder.includes(fragment.name?.value)) { @@ -307,10 +329,54 @@ function processArguments(queryArguments, fragment) { } queryArguments.push(placeholderArgument) } - return + let transformOptionsToNest = [] + let newLayout = layout + queryArguments.forEach((argument, index) => { + if (argument.name.value === `maxWidth`) { + argument.name.value = `width` + if (layout === `fluid` && Number(argument.value.value) >= 1000) { + delete queryArguments[index] + const maxHeightIndex = queryArguments.findIndex( + arg => arg?.name?.value === `maxHeight` + ) + + delete queryArguments?.[maxHeightIndex] + + console.log( + `maxWidth is no longer supported for fluid (now fullWidth) images. It's been removed from your query in ${state.opts.filename}.` + ) + } else if (layout === `fluid` && Number(argument.value.value) < 1000) { + console.log( + `maxWidth is no longer supported for fluid (now fullWidth) images. We've updated the query in ${state.opts.filename} to use a constrained image instead.` + ) + newLayout = `constrained` + } + } else if (argument.name.value === `maxHeight`) { + argument.name.value = `height` + console.log( + `maxHeight is no longer supported for fluid (now fullWidth) images. It's been removed from your query in ${state.opts.filename}.` + ) + } else if (transformOptions.includes(argument.name.value)) { + transformOptionsToNest.push(argument) + delete queryArguments[index] + } else if (otherOptions.includes(argument.name.value)) { + console.log( + `${argument.name.value} is now a nested value, please see the API docs and update the query in ${state.opts.filename} manually.` + ) + } + }) + if (transformOptionsToNest.length > 0) { + const newOptions = { + kind: `Argument`, + name: { kind: `Name`, value: `transformOptions` }, + value: { kind: `ObjectValue`, fields: transformOptionsToNest }, + } + queryArguments.push(newOptions) + } + return newLayout } -function processGraphQLQuery(query) { +function processGraphQLQuery(query, state) { try { let hasChanged = false // this is sort of a hack, but print changes formatting and we only want to use it when we have to const ast = graphql.parse(query) @@ -333,7 +399,7 @@ function processGraphQLQuery(query) { if (!fixedOrFluidField) { return } - let imageType = fixedOrFluidField.name.value + let layout = fixedOrFluidField.name.value const fragments = fixedOrFluidField.selectionSet.selections const presentationSizeFragment = fragments.find( @@ -341,10 +407,15 @@ function processGraphQLQuery(query) { name.value === `GatsbyImageSharpFluidLimitPresentationSize` ) if (presentationSizeFragment) { - imageType = `constrained` + layout = `constrained` delete fragments[presentationSizeFragment] } - processArguments(fixedOrFluidField.arguments, fragments?.[0]) + layout = processArguments( + fixedOrFluidField.arguments, + fragments?.[0], + layout, + state + ) const typeArgument = { kind: `Argument`, @@ -354,7 +425,7 @@ function processGraphQLQuery(query) { }, value: { kind: `EnumValue`, - value: typeMapper[imageType], + value: typeMapper[layout], }, } diff --git a/packages/gatsby-core-utils/CHANGELOG.md b/packages/gatsby-core-utils/CHANGELOG.md index 2533932925fb9..b95d3ff189219 100644 --- a/packages/gatsby-core-utils/CHANGELOG.md +++ b/packages/gatsby-core-utils/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [1.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-core-utils@1.9.0-next.0...gatsby-core-utils@1.10.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-core-utils + # [1.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-core-utils@1.8.0-next.1...gatsby-core-utils@1.9.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-core-utils diff --git a/packages/gatsby-core-utils/package.json b/packages/gatsby-core-utils/package.json index a9d0646e53e36..ea2427dfbca7a 100644 --- a/packages/gatsby-core-utils/package.json +++ b/packages/gatsby-core-utils/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-core-utils", - "version": "1.9.0-next.0", + "version": "1.10.0-next.0", "description": "A collection of gatsby utils used in different gatsby packages", "keywords": [ "gatsby", @@ -41,7 +41,7 @@ "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", "@types/ci-info": "2.0.0", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3", "typescript": "^3.9.7" }, diff --git a/packages/gatsby-cypress/CHANGELOG.md b/packages/gatsby-cypress/CHANGELOG.md index cfaadd0018bb2..3640d55ab94e1 100644 --- a/packages/gatsby-cypress/CHANGELOG.md +++ b/packages/gatsby-cypress/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.11.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-cypress@0.10.0-next.0...gatsby-cypress@0.11.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-cypress + # [0.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-cypress@0.9.0-next.0...gatsby-cypress@0.10.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-cypress diff --git a/packages/gatsby-cypress/package.json b/packages/gatsby-cypress/package.json index 9057b263bb182..4f7f4424c5992 100644 --- a/packages/gatsby-cypress/package.json +++ b/packages/gatsby-cypress/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-cypress", - "version": "0.10.0-next.0", + "version": "0.11.0-next.0", "description": "Cypress tools for Gatsby projects", "main": "index.js", "repository": { @@ -20,7 +20,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "keywords": [ diff --git a/packages/gatsby-design-tokens/CHANGELOG.md b/packages/gatsby-design-tokens/CHANGELOG.md index 41698f86f8fb2..0b13b22e48a86 100644 --- a/packages/gatsby-design-tokens/CHANGELOG.md +++ b/packages/gatsby-design-tokens/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.7.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-design-tokens@2.6.0-next.1...gatsby-design-tokens@2.7.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-design-tokens + # [2.6.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-design-tokens@2.6.0-next.0...gatsby-design-tokens@2.6.0-next.1) (2021-01-12) **Note:** Version bump only for package gatsby-design-tokens diff --git a/packages/gatsby-design-tokens/package.json b/packages/gatsby-design-tokens/package.json index fbd6a715fc098..21b83147af5bb 100644 --- a/packages/gatsby-design-tokens/package.json +++ b/packages/gatsby-design-tokens/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-design-tokens", - "version": "2.6.0-next.1", + "version": "2.7.0-next.0", "description": "Gatsby Design Tokens", "main": "dist/index.js", "module": "dist/index.esm.js", diff --git a/packages/gatsby-dev-cli/CHANGELOG.md b/packages/gatsby-dev-cli/CHANGELOG.md index 2351906cd1e86..c01c4a399eabc 100644 --- a/packages/gatsby-dev-cli/CHANGELOG.md +++ b/packages/gatsby-dev-cli/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.14.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-dev-cli@2.13.0-next.1...gatsby-dev-cli@2.14.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-dev-cli + # [2.13.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-dev-cli@2.13.0-next.0...gatsby-dev-cli@2.13.0-next.1) (2021-01-12) ### Bug Fixes diff --git a/packages/gatsby-dev-cli/package.json b/packages/gatsby-dev-cli/package.json index 3d670c088f32c..880a6225a2814 100644 --- a/packages/gatsby-dev-cli/package.json +++ b/packages/gatsby-dev-cli/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-dev-cli", "description": "CLI helpers for contributors working on Gatsby", - "version": "2.13.0-next.1", + "version": "2.14.0-next.0", "author": "Kyle Mathews ", "bin": { "gatsby-dev": "./dist/index.js" @@ -27,7 +27,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-dev-cli#readme", diff --git a/packages/gatsby-graphiql-explorer/CHANGELOG.md b/packages/gatsby-graphiql-explorer/CHANGELOG.md index 0d3619fad52e3..e3a37923cf71b 100644 --- a/packages/gatsby-graphiql-explorer/CHANGELOG.md +++ b/packages/gatsby-graphiql-explorer/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. +# [0.11.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-graphiql-explorer@0.10.0-next.0...gatsby-graphiql-explorer@0.11.0-next.0) (2021-01-18) + +### Features + +- **gatsby-graphiql-explorer:** add support for magic fragments ([#28878](https://github.com/gatsbyjs/gatsby/issues/28878)) ([a03e862](https://github.com/gatsbyjs/gatsby/commit/a03e862fe1ec54ac6609a67528234476dfb76dfa)) + # [0.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-graphiql-explorer@0.9.0-next.1...gatsby-graphiql-explorer@0.10.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-graphiql-explorer diff --git a/packages/gatsby-graphiql-explorer/README.md b/packages/gatsby-graphiql-explorer/README.md index 16c9e475d88ad..92b37aa906ec4 100644 --- a/packages/gatsby-graphiql-explorer/README.md +++ b/packages/gatsby-graphiql-explorer/README.md @@ -10,6 +10,7 @@ _Note:_ accessible at `http://localhost:8000/___graphql` after running `gatsby d - Offline support - for when you need to work on your excellent Gatsby app on a plane, train, or elsewhere off the grid - [GraphiQL Explorer][graphiql-explorer] - an interactive explorer plugin to visually create and interact with the GraphQL schema +- Support for implied fragments - whether provided by you, core or plugins. Autocompletion, validation & operation execution are all covered! - _All_ the expected features you know and love from [GraphiQL][graphiql] [graphiql]: https://github.com/graphql/graphiql diff --git a/packages/gatsby-graphiql-explorer/package.json b/packages/gatsby-graphiql-explorer/package.json index d36e24631a792..8b2a9d93a4297 100644 --- a/packages/gatsby-graphiql-explorer/package.json +++ b/packages/gatsby-graphiql-explorer/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-graphiql-explorer", - "version": "0.10.0-next.0", + "version": "0.11.0-next.0", "description": "GraphiQL IDE with custom features for Gatsby users", "main": "index.js", "scripts": { @@ -38,17 +38,18 @@ "@babel/preset-env": "^7.12.1", "@babel/preset-react": "^7.12.5", "babel-loader": "^8.2.2", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "core-js": "^3.8.1", "cross-env": "^7.0.3", "css-loader": "^1.0.1", - "graphiql": "^0.17.5", - "graphiql-code-exporter": "^2.0.9", + "graphiql": "^1.3.2", + "graphiql-code-exporter": "^3.0.3", "graphiql-explorer": "^0.6.2", "html-webpack-plugin": "^3.2.0", "npm-run-all": "4.1.5", "react": "^16.12.0", "react-dom": "^16.12.0", + "regenerator-runtime": "^0.13.7", "style-loader": "^0.23.1", "webpack": "^4.44.2", "webpack-cli": "^3.3.12", diff --git a/packages/gatsby-graphiql-explorer/src/app/app.js b/packages/gatsby-graphiql-explorer/src/app/app.js index 50b3d3e8e1e2b..199e6e5c79c7c 100644 --- a/packages/gatsby-graphiql-explorer/src/app/app.js +++ b/packages/gatsby-graphiql-explorer/src/app/app.js @@ -1,3 +1,6 @@ +// needed for graphiql-code-exporter +import "regenerator-runtime/runtime.js" + import React from "react" import ReactDOM from "react-dom" @@ -66,6 +69,11 @@ function graphQLFetcher(graphQLParams) { }) } +const fetchFragments = async () => + fetch(`/___graphiql/fragments`) + .catch(err => console.error(`Error fetching external fragments: \n${err}`)) + .then(response => response.json()) + // When the query and variables string is edited, update the URL bar so // that it can be easily shared. function onEditVariables(newVariables) { @@ -163,6 +171,7 @@ const storedCodeExporterPaneState = class App extends React.Component { state = { schema: null, + externalFragments: null, query: DEFAULT_QUERY, variables: DEFAULT_VARIABLES, explorerIsOpen: storedExplorerPaneState, @@ -313,11 +322,22 @@ class App extends React.Component { Authorization: this.state.refreshToken, } } + fetchFragments().then(externalFragments => { + this.setState({ externalFragments }) + }) + return fetch(`/__refresh`, options) } render() { - const { query, variables, schema, codeExporterIsOpen } = this.state + const { + query, + variables, + schema, + codeExporterIsOpen, + externalFragments: externalFragmentsState, + } = this.state + const { externalFragments } = this.props const codeExporter = codeExporterIsOpen ? ( , document.getElementById(`root`)) +// crude way to fetch fragments on boot time +// it won't hot reload fragments (refresh requires) +// but good enough for initial integration +fetchFragments().then(externalFragments => { + ReactDOM.render( + , + document.getElementById(`root`) + ) +}) diff --git a/packages/gatsby-graphiql-explorer/src/app/webpack.config.js b/packages/gatsby-graphiql-explorer/src/app/webpack.config.js index f1e0fb06fc21b..a4649e6be5bac 100644 --- a/packages/gatsby-graphiql-explorer/src/app/webpack.config.js +++ b/packages/gatsby-graphiql-explorer/src/app/webpack.config.js @@ -35,7 +35,7 @@ module.exports = { { useBuiltIns: true, pragma: `React.createElement`, - development: false, + development: mode !== `production`, }, ], ], diff --git a/packages/gatsby-graphiql-explorer/src/index.js b/packages/gatsby-graphiql-explorer/src/index.js index 8efd4243195b1..f6b649fecffc1 100644 --- a/packages/gatsby-graphiql-explorer/src/index.js +++ b/packages/gatsby-graphiql-explorer/src/index.js @@ -1,7 +1,9 @@ const path = require(`path`) -module.exports = (expressApp, { graphqlEndpoint }) => { +module.exports = (expressApp, { graphqlEndpoint, getFragments }) => { const bundleUrlHandler = path.posix.join(graphqlEndpoint, `app.js`) + const fragmentsUrlHandler = path.posix.join(graphqlEndpoint, `fragments`) + expressApp.get(bundleUrlHandler, (req, res) => { res.set(`Cache-Control`, `public, max-age=31557600`) res.sendFile(path.join(__dirname, `app.js`)) @@ -10,4 +12,10 @@ module.exports = (expressApp, { graphqlEndpoint }) => { expressApp.get(graphqlEndpoint, (req, res) => { res.sendFile(path.join(__dirname, `index.html`)) }) + + expressApp.get(fragmentsUrlHandler, (req, res) => { + // getFragments might not be passed if older gatsby core version is used + // so checking before calling it + res.json(getFragments ? getFragments() : []) + }) } diff --git a/packages/gatsby-image/CHANGELOG.md b/packages/gatsby-image/CHANGELOG.md index 607d90dfe9f83..fd0a69671cceb 100644 --- a/packages/gatsby-image/CHANGELOG.md +++ b/packages/gatsby-image/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.11.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-image@2.10.0-next.1...gatsby-image@2.11.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-image + # [2.10.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-image@2.10.0-next.0...gatsby-image@2.10.0-next.1) (2021-01-12) **Note:** Version bump only for package gatsby-image diff --git a/packages/gatsby-image/package.json b/packages/gatsby-image/package.json index 1769f707bf6a7..54cbfffdd223e 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.10.0-next.1", + "version": "2.11.0-next.0", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -15,7 +15,7 @@ "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", "@testing-library/react": "^9.5.0", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3", "jest-matchmedia-mock": "^1.1.0" }, diff --git a/packages/gatsby-legacy-polyfills/CHANGELOG.md b/packages/gatsby-legacy-polyfills/CHANGELOG.md index 2db9a7f80db9d..02a66da200b43 100644 --- a/packages/gatsby-legacy-polyfills/CHANGELOG.md +++ b/packages/gatsby-legacy-polyfills/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.7.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-legacy-polyfills@0.6.0-next.0...gatsby-legacy-polyfills@0.7.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-legacy-polyfills + # [0.6.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-legacy-polyfills@0.5.0-next.0...gatsby-legacy-polyfills@0.6.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-legacy-polyfills diff --git a/packages/gatsby-legacy-polyfills/package.json b/packages/gatsby-legacy-polyfills/package.json index a38dd46c575b8..ef2f2ffe3328d 100644 --- a/packages/gatsby-legacy-polyfills/package.json +++ b/packages/gatsby-legacy-polyfills/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-legacy-polyfills", "description": "Polyfills for legacy browsers", - "version": "0.6.0-next.0", + "version": "0.7.0-next.0", "main": "dist/polyfills.js", "author": "Ward Peeters ", "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-legacy-polyfills#readme", diff --git a/packages/gatsby-link/CHANGELOG.md b/packages/gatsby-link/CHANGELOG.md index 8f30f1e7af399..036e1d13b5d91 100644 --- a/packages/gatsby-link/CHANGELOG.md +++ b/packages/gatsby-link/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.11.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-link@2.10.0-next.1...gatsby-link@2.11.0-next.0) (2021-01-18) + +### Bug Fixes + +- **security:** update vulnerable packages, include React 17 in peerDeps ([#28545](https://github.com/gatsbyjs/gatsby/issues/28545)) ([18b5f30](https://github.com/gatsbyjs/gatsby/commit/18b5f30e367895aa5f3af46e4989b347912a0f35)) + # [2.10.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-link@2.10.0-next.0...gatsby-link@2.10.0-next.1) (2021-01-12) **Note:** Version bump only for package gatsby-link diff --git a/packages/gatsby-link/package.json b/packages/gatsby-link/package.json index 5f54df14f0a40..affc0480eb74d 100644 --- a/packages/gatsby-link/package.json +++ b/packages/gatsby-link/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-link", "description": "An enhanced Link component for Gatsby sites with support for resource prefetching", - "version": "2.10.0-next.1", + "version": "2.11.0-next.0", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -15,13 +15,13 @@ "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", "@testing-library/react": "^9.5.0", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "peerDependencies": { "@reach/router": "^1.3.3", - "react": "^16.4.2", - "react-dom": "^16.4.2" + "react": "^16.4.2 || ^17.0.0", + "react-dom": "^16.4.2 || ^17.0.0" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-link#readme", "keywords": [ diff --git a/packages/gatsby-page-utils/CHANGELOG.md b/packages/gatsby-page-utils/CHANGELOG.md index 6e9cc75c2cc11..6665ae0cc6eaf 100644 --- a/packages/gatsby-page-utils/CHANGELOG.md +++ b/packages/gatsby-page-utils/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-page-utils@0.8.0-next.0...gatsby-page-utils@0.9.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-page-utils + # [0.8.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-page-utils@0.7.0-next.1...gatsby-page-utils@0.8.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-page-utils diff --git a/packages/gatsby-page-utils/package.json b/packages/gatsby-page-utils/package.json index dc702ccb0cc36..fc919154395a7 100644 --- a/packages/gatsby-page-utils/package.json +++ b/packages/gatsby-page-utils/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-page-utils", - "version": "0.8.0-next.0", + "version": "0.9.0-next.0", "description": "Gatsby library that helps creating pages", "main": "dist/index.js", "types": "dist/index.d.ts", @@ -26,7 +26,7 @@ "bluebird": "^3.7.2", "chokidar": "^3.4.3", "fs-exists-cached": "^1.0.0", - "gatsby-core-utils": "^1.9.0-next.0", + "gatsby-core-utils": "^1.10.0-next.0", "glob": "^7.1.6", "lodash": "^4.17.20", "micromatch": "^4.0.2" @@ -35,7 +35,7 @@ "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", "@types/micromatch": "^4.0.1", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3", "rimraf": "^3.0.2", "typescript": "^3.9.7" diff --git a/packages/gatsby-plugin-benchmark-reporting/CHANGELOG.md b/packages/gatsby-plugin-benchmark-reporting/CHANGELOG.md index c263c451295f2..dec17ed5e1c21 100644 --- a/packages/gatsby-plugin-benchmark-reporting/CHANGELOG.md +++ b/packages/gatsby-plugin-benchmark-reporting/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-benchmark-reporting@0.8.0-next.0...gatsby-plugin-benchmark-reporting@0.9.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-benchmark-reporting + # [0.8.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-benchmark-reporting@0.7.0-next.0...gatsby-plugin-benchmark-reporting@0.8.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-plugin-benchmark-reporting diff --git a/packages/gatsby-plugin-benchmark-reporting/package.json b/packages/gatsby-plugin-benchmark-reporting/package.json index 760bf55b1827e..e97ce5a3bc13f 100644 --- a/packages/gatsby-plugin-benchmark-reporting/package.json +++ b/packages/gatsby-plugin-benchmark-reporting/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-benchmark-reporting", "description": "Gatsby Benchmark Reporting", - "version": "0.8.0-next.0", + "version": "0.9.0-next.0", "author": "Peter van der Zee ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -16,7 +16,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0" + "babel-preset-gatsby-package": "^0.12.0-next.0" }, "dependencies": { "fast-glob": "^3.2.4", diff --git a/packages/gatsby-plugin-canonical-urls/CHANGELOG.md b/packages/gatsby-plugin-canonical-urls/CHANGELOG.md index 2683e55ebe967..a4352b48cc459 100644 --- a/packages/gatsby-plugin-canonical-urls/CHANGELOG.md +++ b/packages/gatsby-plugin-canonical-urls/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-canonical-urls@2.9.0-next.0...gatsby-plugin-canonical-urls@2.10.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-canonical-urls + # [2.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-canonical-urls@2.8.0-next.0...gatsby-plugin-canonical-urls@2.9.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-plugin-canonical-urls diff --git a/packages/gatsby-plugin-canonical-urls/package.json b/packages/gatsby-plugin-canonical-urls/package.json index f26e9519b278f..660ee7802d7ad 100644 --- a/packages/gatsby-plugin-canonical-urls/package.json +++ b/packages/gatsby-plugin-canonical-urls/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-canonical-urls", "description": "Add canonical links to HTML pages Gatsby generates.", - "version": "2.9.0-next.0", + "version": "2.10.0-next.0", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -12,7 +12,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-canonical-urls#readme", diff --git a/packages/gatsby-plugin-catch-links/CHANGELOG.md b/packages/gatsby-plugin-catch-links/CHANGELOG.md index 5fdc78d222d0f..25b3ba8751874 100644 --- a/packages/gatsby-plugin-catch-links/CHANGELOG.md +++ b/packages/gatsby-plugin-catch-links/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-catch-links@2.9.0-next.1...gatsby-plugin-catch-links@2.10.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-catch-links + # [2.9.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-catch-links@2.9.0-next.0...gatsby-plugin-catch-links@2.9.0-next.1) (2021-01-12) **Note:** Version bump only for package gatsby-plugin-catch-links diff --git a/packages/gatsby-plugin-catch-links/package.json b/packages/gatsby-plugin-catch-links/package.json index 438ab2ae8597e..1a0ede78dbfc8 100644 --- a/packages/gatsby-plugin-catch-links/package.json +++ b/packages/gatsby-plugin-catch-links/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-catch-links", "description": "Intercepts local links from markdown and other non-react pages and does a client-side pushState to avoid the browser having to refresh the page.", - "version": "2.9.0-next.1", + "version": "2.10.0-next.0", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -13,7 +13,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-catch-links#readme", diff --git a/packages/gatsby-plugin-coffeescript/CHANGELOG.md b/packages/gatsby-plugin-coffeescript/CHANGELOG.md index b210cecaf90a9..76a0d9a69ce96 100644 --- a/packages/gatsby-plugin-coffeescript/CHANGELOG.md +++ b/packages/gatsby-plugin-coffeescript/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-coffeescript@2.9.0-next.0...gatsby-plugin-coffeescript@2.10.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-coffeescript + # [2.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-coffeescript@2.8.0-next.0...gatsby-plugin-coffeescript@2.9.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-plugin-coffeescript diff --git a/packages/gatsby-plugin-coffeescript/package.json b/packages/gatsby-plugin-coffeescript/package.json index aa88ed259df73..4fe60d21bcd60 100644 --- a/packages/gatsby-plugin-coffeescript/package.json +++ b/packages/gatsby-plugin-coffeescript/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-coffeescript", "description": "Adds CoffeeScript support for Gatsby", - "version": "2.9.0-next.0", + "version": "2.10.0-next.0", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -18,7 +18,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-coffeescript#readme", diff --git a/packages/gatsby-plugin-create-client-paths/CHANGELOG.md b/packages/gatsby-plugin-create-client-paths/CHANGELOG.md index 7a347d1c42859..58cde60a9a84b 100644 --- a/packages/gatsby-plugin-create-client-paths/CHANGELOG.md +++ b/packages/gatsby-plugin-create-client-paths/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-create-client-paths@2.9.0-next.0...gatsby-plugin-create-client-paths@2.10.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-create-client-paths + # [2.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-create-client-paths@2.8.0-next.0...gatsby-plugin-create-client-paths@2.9.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-plugin-create-client-paths diff --git a/packages/gatsby-plugin-create-client-paths/package.json b/packages/gatsby-plugin-create-client-paths/package.json index df41d385fcf18..68bddfd77790f 100644 --- a/packages/gatsby-plugin-create-client-paths/package.json +++ b/packages/gatsby-plugin-create-client-paths/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-create-client-paths", "description": "Gatsby-plugin for creating paths that exist only on the client", - "version": "2.9.0-next.0", + "version": "2.10.0-next.0", "author": "scott.eckenthal@gmail.com", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -12,7 +12,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-create-client-paths#readme", diff --git a/packages/gatsby-plugin-cxs/CHANGELOG.md b/packages/gatsby-plugin-cxs/CHANGELOG.md index ba51be45783fa..920daa66e0297 100644 --- a/packages/gatsby-plugin-cxs/CHANGELOG.md +++ b/packages/gatsby-plugin-cxs/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-cxs@2.9.0-next.1...gatsby-plugin-cxs@2.10.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-cxs + # [2.9.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-cxs@2.9.0-next.0...gatsby-plugin-cxs@2.9.0-next.1) (2021-01-12) **Note:** Version bump only for package gatsby-plugin-cxs diff --git a/packages/gatsby-plugin-cxs/package.json b/packages/gatsby-plugin-cxs/package.json index c0a855b0cd4d8..d9c16e866cd38 100644 --- a/packages/gatsby-plugin-cxs/package.json +++ b/packages/gatsby-plugin-cxs/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-cxs", "description": "Gatsby plugin to add SSR support for ctx", - "version": "2.9.0-next.1", + "version": "2.10.0-next.0", "author": "Chen-Tai Hou ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -12,10 +12,10 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3", "cxs": "^6.2.0", - "gatsby-plugin-utils": "^0.8.0-next.1" + "gatsby-plugin-utils": "^0.9.0-next.0" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-cxs#readme", "keywords": [ diff --git a/packages/gatsby-plugin-emotion/CHANGELOG.md b/packages/gatsby-plugin-emotion/CHANGELOG.md index f0c0fe2d1fa77..b22ba75d95ce8 100644 --- a/packages/gatsby-plugin-emotion/CHANGELOG.md +++ b/packages/gatsby-plugin-emotion/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [5.4.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-emotion@5.3.0-next.1...gatsby-plugin-emotion@5.4.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-emotion + # [5.3.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-emotion@5.3.0-next.0...gatsby-plugin-emotion@5.3.0-next.1) (2021-01-12) **Note:** Version bump only for package gatsby-plugin-emotion diff --git a/packages/gatsby-plugin-emotion/package.json b/packages/gatsby-plugin-emotion/package.json index a892a782ba142..12f7cccc98227 100644 --- a/packages/gatsby-plugin-emotion/package.json +++ b/packages/gatsby-plugin-emotion/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-emotion", "description": "Gatsby plugin to add support for Emotion", - "version": "5.3.0-next.1", + "version": "5.4.0-next.0", "author": "Tegan Churchill ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -13,7 +13,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "peerDependencies": { diff --git a/packages/gatsby-plugin-facebook-analytics/CHANGELOG.md b/packages/gatsby-plugin-facebook-analytics/CHANGELOG.md index 1e53b4e4b531f..f5233c9c2cbab 100644 --- a/packages/gatsby-plugin-facebook-analytics/CHANGELOG.md +++ b/packages/gatsby-plugin-facebook-analytics/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.11.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-facebook-analytics@2.10.0-next.0...gatsby-plugin-facebook-analytics@2.11.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-facebook-analytics + # [2.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-facebook-analytics@2.9.0-next.0...gatsby-plugin-facebook-analytics@2.10.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-plugin-facebook-analytics diff --git a/packages/gatsby-plugin-facebook-analytics/package.json b/packages/gatsby-plugin-facebook-analytics/package.json index a071119f950cd..4dcbce8a19618 100644 --- a/packages/gatsby-plugin-facebook-analytics/package.json +++ b/packages/gatsby-plugin-facebook-analytics/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-facebook-analytics", "description": "Gatsby plugin to add facebook analytics onto a site", - "version": "2.10.0-next.0", + "version": "2.11.0-next.0", "author": "Yeison Daza ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -12,7 +12,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-facebook-analytics#readme", diff --git a/packages/gatsby-plugin-feed/CHANGELOG.md b/packages/gatsby-plugin-feed/CHANGELOG.md index 6588df8c8c8aa..d4268c4b51ceb 100644 --- a/packages/gatsby-plugin-feed/CHANGELOG.md +++ b/packages/gatsby-plugin-feed/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.13.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-feed@2.12.0-next.1...gatsby-plugin-feed@2.13.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-feed + # [2.12.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-feed@2.12.0-next.0...gatsby-plugin-feed@2.12.0-next.1) (2021-01-12) **Note:** Version bump only for package gatsby-plugin-feed diff --git a/packages/gatsby-plugin-feed/package.json b/packages/gatsby-plugin-feed/package.json index c136fb2af5721..c21389e73caa5 100644 --- a/packages/gatsby-plugin-feed/package.json +++ b/packages/gatsby-plugin-feed/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-feed", "description": "Creates an RSS feed for your Gatsby site.", - "version": "2.12.0-next.1", + "version": "2.13.0-next.0", "author": "Nicholas Young ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -11,14 +11,14 @@ "@hapi/joi": "^15.1.1", "common-tags": "^1.8.0", "fs-extra": "^8.1.0", - "gatsby-plugin-utils": "^0.8.0-next.1", + "gatsby-plugin-utils": "^0.9.0-next.0", "lodash.merge": "^4.6.2", "rss": "^1.2.2" }, "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-feed#readme", diff --git a/packages/gatsby-plugin-flow/CHANGELOG.md b/packages/gatsby-plugin-flow/CHANGELOG.md index 4ecdec436df34..4075ca3010a6f 100644 --- a/packages/gatsby-plugin-flow/CHANGELOG.md +++ b/packages/gatsby-plugin-flow/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [1.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-flow@1.9.0-next.0...gatsby-plugin-flow@1.10.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-flow + # [1.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-flow@1.8.0-next.0...gatsby-plugin-flow@1.9.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-plugin-flow diff --git a/packages/gatsby-plugin-flow/package.json b/packages/gatsby-plugin-flow/package.json index 87165132d14b0..256f3f04fd5ae 100644 --- a/packages/gatsby-plugin-flow/package.json +++ b/packages/gatsby-plugin-flow/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-plugin-flow", - "version": "1.9.0-next.0", + "version": "1.10.0-next.0", "description": "Provides drop-in support for Flow by adding @babel/preset-flow.", "main": "index.js", "scripts": { @@ -30,7 +30,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "engines": { diff --git a/packages/gatsby-plugin-fullstory/CHANGELOG.md b/packages/gatsby-plugin-fullstory/CHANGELOG.md index 982fc5988f9f0..f1e0ce6b323c0 100644 --- a/packages/gatsby-plugin-fullstory/CHANGELOG.md +++ b/packages/gatsby-plugin-fullstory/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-fullstory@2.9.0-next.0...gatsby-plugin-fullstory@2.10.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-fullstory + # [2.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-fullstory@2.8.0-next.0...gatsby-plugin-fullstory@2.9.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-plugin-fullstory diff --git a/packages/gatsby-plugin-fullstory/package.json b/packages/gatsby-plugin-fullstory/package.json index 9fda6fb586a48..1c595faf00097 100644 --- a/packages/gatsby-plugin-fullstory/package.json +++ b/packages/gatsby-plugin-fullstory/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-plugin-fullstory", - "version": "2.9.0-next.0", + "version": "2.10.0-next.0", "description": "Plugin to add the tracking code for Fullstory.com", "main": "index.js", "scripts": { @@ -29,7 +29,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "peerDependencies": { diff --git a/packages/gatsby-plugin-glamor/CHANGELOG.md b/packages/gatsby-plugin-glamor/CHANGELOG.md index 45d828f9bf43d..89fc0362e371d 100644 --- a/packages/gatsby-plugin-glamor/CHANGELOG.md +++ b/packages/gatsby-plugin-glamor/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-glamor@2.9.0-next.1...gatsby-plugin-glamor@2.10.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-glamor + # [2.9.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-glamor@2.9.0-next.0...gatsby-plugin-glamor@2.9.0-next.1) (2021-01-12) **Note:** Version bump only for package gatsby-plugin-glamor diff --git a/packages/gatsby-plugin-glamor/package.json b/packages/gatsby-plugin-glamor/package.json index 8068840852950..7c5b810d83d58 100644 --- a/packages/gatsby-plugin-glamor/package.json +++ b/packages/gatsby-plugin-glamor/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-glamor", "description": "Gatsby plugin to add support for Glamor", - "version": "2.9.0-next.1", + "version": "2.10.0-next.0", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -12,9 +12,9 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3", - "gatsby-plugin-utils": "^0.8.0-next.1" + "gatsby-plugin-utils": "^0.9.0-next.0" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-glamor#readme", "keywords": [ diff --git a/packages/gatsby-plugin-google-analytics/CHANGELOG.md b/packages/gatsby-plugin-google-analytics/CHANGELOG.md index 7161cab23172d..cd09920e951a6 100644 --- a/packages/gatsby-plugin-google-analytics/CHANGELOG.md +++ b/packages/gatsby-plugin-google-analytics/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.11.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-google-analytics@2.10.0-next.1...gatsby-plugin-google-analytics@2.11.0-next.0) (2021-01-18) + +### Bug Fixes + +- **security:** update vulnerable packages, include React 17 in peerDeps ([#28545](https://github.com/gatsbyjs/gatsby/issues/28545)) ([18b5f30](https://github.com/gatsbyjs/gatsby/commit/18b5f30e367895aa5f3af46e4989b347912a0f35)) + # [2.10.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-google-analytics@2.10.0-next.0...gatsby-plugin-google-analytics@2.10.0-next.1) (2021-01-12) **Note:** Version bump only for package gatsby-plugin-google-analytics diff --git a/packages/gatsby-plugin-google-analytics/package.json b/packages/gatsby-plugin-google-analytics/package.json index 219f1770bbecd..edc34c4bbd0a7 100644 --- a/packages/gatsby-plugin-google-analytics/package.json +++ b/packages/gatsby-plugin-google-analytics/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-google-analytics", "description": "Gatsby plugin to add google analytics onto a site", - "version": "2.10.0-next.1", + "version": "2.11.0-next.0", "author": "Kyle Mathews ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -14,7 +14,7 @@ "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", "@testing-library/react": "^9.5.0", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-google-analytics#readme", @@ -27,8 +27,8 @@ "main": "index.js", "peerDependencies": { "gatsby": "^2.0.0", - "react": "^16.4.2", - "react-dom": "^16.4.2" + "react": "^16.4.2 || ^17.0.0", + "react-dom": "^16.4.2 || ^17.0.0" }, "repository": { "type": "git", diff --git a/packages/gatsby-plugin-google-gtag/CHANGELOG.md b/packages/gatsby-plugin-google-gtag/CHANGELOG.md index f75ffb313a540..e5730293f3c13 100644 --- a/packages/gatsby-plugin-google-gtag/CHANGELOG.md +++ b/packages/gatsby-plugin-google-gtag/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.8.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-google-gtag@2.7.0-next.0...gatsby-plugin-google-gtag@2.8.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-google-gtag + # [2.7.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-google-gtag@2.6.0-next.0...gatsby-plugin-google-gtag@2.7.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-plugin-google-gtag diff --git a/packages/gatsby-plugin-google-gtag/package.json b/packages/gatsby-plugin-google-gtag/package.json index 971ed238617f6..29b2b5ec7686b 100644 --- a/packages/gatsby-plugin-google-gtag/package.json +++ b/packages/gatsby-plugin-google-gtag/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-google-gtag", "description": "Gatsby plugin to add google gtag onto a site", - "version": "2.7.0-next.0", + "version": "2.8.0-next.0", "author": "Tyler Buchea ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -13,7 +13,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-google-gtag#readme", diff --git a/packages/gatsby-plugin-google-tagmanager/CHANGELOG.md b/packages/gatsby-plugin-google-tagmanager/CHANGELOG.md index d1c2d160bd12a..4f864933d388c 100644 --- a/packages/gatsby-plugin-google-tagmanager/CHANGELOG.md +++ b/packages/gatsby-plugin-google-tagmanager/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.11.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-google-tagmanager@2.10.0-next.1...gatsby-plugin-google-tagmanager@2.11.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-google-tagmanager + # [2.10.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-google-tagmanager@2.10.0-next.0...gatsby-plugin-google-tagmanager@2.10.0-next.1) (2021-01-12) **Note:** Version bump only for package gatsby-plugin-google-tagmanager diff --git a/packages/gatsby-plugin-google-tagmanager/package.json b/packages/gatsby-plugin-google-tagmanager/package.json index 1918cbc7f8fcb..21d5809cd2944 100644 --- a/packages/gatsby-plugin-google-tagmanager/package.json +++ b/packages/gatsby-plugin-google-tagmanager/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-google-tagmanager", "description": "Gatsby plugin to add google tagmanager onto a site", - "version": "2.10.0-next.1", + "version": "2.11.0-next.0", "author": "Thijs Koerselman ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -12,9 +12,9 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3", - "gatsby-plugin-utils": "^0.8.0-next.1" + "gatsby-plugin-utils": "^0.9.0-next.0" }, "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-google-tagmanager#readme", "keywords": [ diff --git a/packages/gatsby-plugin-graphql-config/CHANGELOG.md b/packages/gatsby-plugin-graphql-config/CHANGELOG.md index 98a607cff80c8..d3fec2b820ee7 100644 --- a/packages/gatsby-plugin-graphql-config/CHANGELOG.md +++ b/packages/gatsby-plugin-graphql-config/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.7.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-graphql-config@0.6.0-next.0...gatsby-plugin-graphql-config@0.7.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-graphql-config + # [0.6.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-graphql-config@0.5.0-next.0...gatsby-plugin-graphql-config@0.6.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-plugin-graphql-config diff --git a/packages/gatsby-plugin-graphql-config/package.json b/packages/gatsby-plugin-graphql-config/package.json index a22df3b16320d..44713d3986b09 100644 --- a/packages/gatsby-plugin-graphql-config/package.json +++ b/packages/gatsby-plugin-graphql-config/package.json @@ -1,7 +1,7 @@ { "name": "gatsby-plugin-graphql-config", "description": "Gatsby plugin to write out a graphql-config with develop process endpoint configured", - "version": "0.6.0-next.0", + "version": "0.7.0-next.0", "author": "Rikki Schulte ", "bugs": { "url": "https://github.com/gatsbyjs/gatsby/issues" @@ -12,7 +12,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "peerDependencies": { diff --git a/packages/gatsby-plugin-guess-js/CHANGELOG.md b/packages/gatsby-plugin-guess-js/CHANGELOG.md index 8a93f75caad47..31b882d76ce62 100644 --- a/packages/gatsby-plugin-guess-js/CHANGELOG.md +++ b/packages/gatsby-plugin-guess-js/CHANGELOG.md @@ -3,6 +3,10 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [1.10.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-guess-js@1.9.0-next.0...gatsby-plugin-guess-js@1.10.0-next.0) (2021-01-18) + +**Note:** Version bump only for package gatsby-plugin-guess-js + # [1.9.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-guess-js@1.8.0-next.0...gatsby-plugin-guess-js@1.9.0-next.0) (2020-12-29) **Note:** Version bump only for package gatsby-plugin-guess-js diff --git a/packages/gatsby-plugin-guess-js/package.json b/packages/gatsby-plugin-guess-js/package.json index 6497d53558077..81f210bc234c4 100644 --- a/packages/gatsby-plugin-guess-js/package.json +++ b/packages/gatsby-plugin-guess-js/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-plugin-guess-js", - "version": "1.9.0-next.0", + "version": "1.10.0-next.0", "description": "Gatsby plugin providing drop-in integration with Guess.js to enabling using machine learning and analytics data to power prefetching", "main": "index.js", "scripts": { @@ -34,7 +34,7 @@ "devDependencies": { "@babel/cli": "^7.12.1", "@babel/core": "^7.12.3", - "babel-preset-gatsby-package": "^0.11.0-next.0", + "babel-preset-gatsby-package": "^0.12.0-next.0", "cross-env": "^7.0.3" }, "peerDependencies": { diff --git a/packages/gatsby-plugin-image/CHANGELOG.md b/packages/gatsby-plugin-image/CHANGELOG.md index 1fcb12c4035bb..ca2e9ac3e849e 100644 --- a/packages/gatsby-plugin-image/CHANGELOG.md +++ b/packages/gatsby-plugin-image/CHANGELOG.md @@ -3,6 +3,18 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.7.0-next.0](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-image@0.6.0-next.1...gatsby-plugin-image@0.7.0-next.0) (2021-01-18) + +### Bug Fixes + +- **gatsby-plugin-image:** Fix onload race condition ([#29064](https://github.com/gatsbyjs/gatsby/issues/29064)) ([6233382](https://github.com/gatsbyjs/gatsby/commit/6233382c6d770e7f1ab6184dccc8c79fd3b7f809)) +- **gatsby-plugin-image:** Handle imgStyle in SSR ([#29043](https://github.com/gatsbyjs/gatsby/issues/29043)) ([b9978e1](https://github.com/gatsbyjs/gatsby/commit/b9978e1f7a4e6a8dec0f034b965dfbce09a372f2)) +- **gatsby-plugin-image:** Remove preload tag ([#28998](https://github.com/gatsbyjs/gatsby/issues/28998)) ([87bdec0](https://github.com/gatsbyjs/gatsby/commit/87bdec0f1ac8de8062fe3c90997b278ff921a4aa)) + +### Features + +- **gatsby-plugin-image:** Change fullWidth to use breakpoints ([#29002](https://github.com/gatsbyjs/gatsby/issues/29002)) ([9bcc12c](https://github.com/gatsbyjs/gatsby/commit/9bcc12c57728bb7ca08cefe4f2f4c684b65d3111)) + # [0.6.0-next.1](https://github.com/gatsbyjs/gatsby/compare/gatsby-plugin-image@0.6.0-next.0...gatsby-plugin-image@0.6.0-next.1) (2021-01-12) ### Bug Fixes diff --git a/packages/gatsby-plugin-image/README.md b/packages/gatsby-plugin-image/README.md index ce902f9df8a51..ba828df196871 100644 --- a/packages/gatsby-plugin-image/README.md +++ b/packages/gatsby-plugin-image/README.md @@ -316,26 +316,28 @@ The optional helper function `getImage` takes a file node and returns `file?.chi These arguments can be passed to the `gatsbyImageData()` resolver: -- **width**: The display width of the generated image for layout = FIXED, if layout = CONSTRAINED it's the display width of the largest generated image. The actual largest image resolution will be this value multiplied by the largest value in outputPixelDensities. -- **height**: If set, the height of the generated image. If omitted, it is calculated from the supplied width, matching the aspect ratio of the source image. +- **width**: The display width of the generated image for layout = FIXED, if layout = CONSTRAINED it's the maximum display width. Ignored for FULL_WIDTH images. +- **height**: If set, the height of the generated image. If omitted, it is calculated from the supplied width, matching the aspect ratio of the source image. Ignored for FULL_WIDTH images. +- **aspectRatio**: Forces an image to the specified aspect ratio, cropping if needed. The value is a number, but can be clearer to express as a fraction, e.g. `aspectRatio={16/9}` - **placeholder**: Format of generated placeholder image. - - `BLURRED`: (default) a blurred, low resolution image, encoded as a base64 data URI - - `TRACED_SVG`: a low-resolution traced SVG of the image. + - `DOMINANT_COLOR`: (default) A solid color, calculated from the dominant color of the image. + - `BLURRED`: a blurred, low resolution image, encoded as a base64 data URI + - `TRACED_SVG`: a single-color traced SVG of the image. - `NONE`: no placeholder. Set "background" to use a fixed background color. - - `DOMINANT_COLOR`: a solid color, calculated from the dominant color of the image. - **layout**: The layout for the image. - `CONSTRAINED`: (default) Resizes to fit its container, up to a maximum width, at which point it will remain fixed in size. - `FIXED`: A static image size, that does not resize according to the screen width - `FULL_WIDTH`: The image resizes to fit its container. Pass a "sizes" option if it isn't going to be the full width of the screen. -- **outputPixelDensities**: A list of image pixel densities to generate, for high-resolution (retina) screens. It will never generate images larger than the source, and will always include a 1x image. - Default is `[ 0.25, 0.5, 1, 2 ]`, for fullWidth/constrained images, and `[ 1, 2 ]` for fixed. - **sizes**: The "[sizes](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images)" attribute, passed to the `` tag. This describes the display size of the image. This does not affect the generated images, but is used by the browser to decide which images to download. You can leave this blank for fixed images, or if the responsive image container will be the full width of the screen. In these cases we will generate an appropriate value. If, however, you are generating responsive images that are not the full width of the screen, you should provide a sizes property for best performance. You can alternatively pass this value to the component. - **formats**: an array of file formats to generate. The default is `[AUTO, WEBP]`, which means it will generate images in the same format as the source image, as well as in the next-generation [WebP](https://developers.google.com/speed/webp) format. We strongly recommend you do not change this option, as doing so will affect performance scores. - **quality**: The default quality. This is overridden by any format-specific options -- **blurredOptions**: Options for the low-resolution placeholder image. Set placeholder to "BLURRED" to use this +- **outputPixelDensities**: A list of image pixel densities to generate, for high-resolution (retina) screens. It will never generate images larger than the source, and will always include a 1x image. + Default is `[ 0.25, 0.5, 1, 2 ]`, for `CONSTRAINED` images, and `[ 1, 2 ]` for `FIXED`. Ignored for `FULL_WIDTH`, which uses `breakpoints` instead. +- **breakpoints**: Output widths to generate for full width images. Default is `[750, 1080, 1366, 1920]`, which is suitable for most common device resolutions. It will never generate an image larger than the source image. The browser will automatically choose the most appropriate. +- **blurredOptions**: Options for the low-resolution placeholder image. Set placeholder to `BLURRED` to use this - width - toFormat -- **tracedSVGOptions**: Options for traced placeholder SVGs. You also should set placeholder to "SVG". +- **tracedSVGOptions**: Options for traced placeholder SVGs. You also should set placeholder to `TRACED_SVG`. - **jpgOptions**: Options to pass to sharp when generating JPG images. - quality - progressive diff --git a/packages/gatsby-plugin-image/package.json b/packages/gatsby-plugin-image/package.json index a6fa2e261d692..8c942f83e334f 100644 --- a/packages/gatsby-plugin-image/package.json +++ b/packages/gatsby-plugin-image/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-plugin-image", - "version": "0.6.0-next.1", + "version": "0.7.0-next.0", "scripts": { "build": "npm-run-all -s clean -p build:*", "build:gatsby-node": "tsc --jsx react --downlevelIteration true --skipLibCheck true --esModuleInterop true --outDir dist/ src/gatsby-node.ts src/babel-plugin-parse-static-images.ts src/resolver-utils.ts src/types.d.ts", @@ -72,11 +72,11 @@ "@babel/parser": "^7.12.5", "@babel/traverse": "^7.12.5", "babel-jsx-utils": "^1.0.1", - "babel-plugin-remove-graphql-queries": "^2.15.0-next.0", + "babel-plugin-remove-graphql-queries": "^2.16.0-next.0", "camelcase": "^5.3.1", "chokidar": "^3.4.3", "fs-extra": "^8.1.0", - "gatsby-core-utils": "^1.9.0-next.0", + "gatsby-core-utils": "^1.10.0-next.0", "prop-types": "^15.7.2" }, "repository": { diff --git a/packages/gatsby-plugin-image/src/__tests__/image-utils.ts b/packages/gatsby-plugin-image/src/__tests__/image-utils.ts index 879a049a9c803..42551c5bcd452 100644 --- a/packages/gatsby-plugin-image/src/__tests__/image-utils.ts +++ b/packages/gatsby-plugin-image/src/__tests__/image-utils.ts @@ -37,6 +37,11 @@ const args: IGatsbyImageHelperArgs = { const fluidArgs: IGatsbyImageHelperArgs = { ...args, + sourceMetadata: { + width: 2000, + height: 1500, + format: `jpg`, + }, layout: `fullWidth`, } @@ -179,12 +184,14 @@ describe(`the image data helper`, () => { it(`returns URLs for fullWidth`, () => { const data = generateImageData(fluidArgs) expect(data?.images?.fallback?.src).toEqual( - `https://example.com/afile.jpg/400/300/image.jpg` + `https://example.com/afile.jpg/750/563/image.jpg` ) - expect(data.images?.sources?.[0].srcSet).toEqual( - `https://example.com/afile.jpg/100/75/image.webp 100w,\nhttps://example.com/afile.jpg/200/150/image.webp 200w,\nhttps://example.com/afile.jpg/400/300/image.webp 400w,\nhttps://example.com/afile.jpg/800/600/image.webp 800w` - ) + expect(data.images?.sources?.[0].srcSet) + .toEqual(`https://example.com/afile.jpg/750/563/image.webp 750w, +https://example.com/afile.jpg/1080/810/image.webp 1080w, +https://example.com/afile.jpg/1366/1025/image.webp 1366w, +https://example.com/afile.jpg/1920/1440/image.webp 1920w`) }) it(`converts to PNG if requested`, () => { diff --git a/packages/gatsby-plugin-image/src/components/gatsby-image.server.tsx b/packages/gatsby-plugin-image/src/components/gatsby-image.server.tsx index 7226dfe9f0349..f7716b930a749 100644 --- a/packages/gatsby-plugin-image/src/components/gatsby-image.server.tsx +++ b/packages/gatsby-plugin-image/src/components/gatsby-image.server.tsx @@ -106,10 +106,18 @@ export const GatsbyImage: FunctionComponent = function GatsbyI )} // When eager is set we want to start the isLoading state on true (we want to load the img without react) - {...getMainProps(loading === `eager`, false, cleanedImages, loading)} + {...getMainProps( + loading === `eager`, + false, + cleanedImages, + loading, + undefined, + undefined, + undefined, + imgStyle + )} /> diff --git a/packages/gatsby-plugin-image/src/components/main-image.tsx b/packages/gatsby-plugin-image/src/components/main-image.tsx index cc6037b4b7a6e..dc40776873e3b 100644 --- a/packages/gatsby-plugin-image/src/components/main-image.tsx +++ b/packages/gatsby-plugin-image/src/components/main-image.tsx @@ -4,21 +4,9 @@ import { Picture, PictureProps } from "./picture" export type MainImageProps = PictureProps export const MainImage = forwardRef( - function MainImage({ ...props }, ref) { + function MainImage(props, ref) { return ( <> - {props.loading === `eager` && ( - - )}