[1.0] Combine typegen and transformer plugins fixes #918 (#926)

* Move files around to remove typegen plugins

* Update example websites

* Remove yarn.lock on build server so sites get latest

* Update yarn.lock

docs/blog/gatsbygram-case-study/index.md

@@ -125,7 +125,7 @@ an innovative *declarative* asset pipeline.
 For Gatsbygram, Gatsby generates over *1000* image thumbnails for
 responsive images without *any* custom scripting by leveraging the
 Gatsby image processing plugin
-[gatsby-typegen-sharp](/docs/packages/gatsby-typegen-sharp/).
+[gatsby-transformer-sharp](/docs/packages/gatsby-transformer-sharp/).
 
 Stop wasting time and build something!
 
@@ -443,14 +443,11 @@ module.exports = {
     `gatsby-plugin-sharp`,
     // This plugin identifies file nodes that are images and
     // transforms these to create new “ImageSharp” nodes.
+    // With them you can resize images and
+    // generate responsive image thumbnails.
     `gatsby-transformer-sharp`,
     // This plugin transforms JSON file nodes.
     `gatsby-transformer-json`,
-    `gatsby-typegen-filesystem`,
-    // This plugin adds GraphQL fields to the ImageSharp
-    // GraphQL type. With them you can resize images and
-    // generate sets of responsive images.
-    `gatsby-typegen-sharp`,
     // This plugin sets up the popular css-in-js library
     // Glamor. It handles adding a Babel plugin and webpack
     // configuration as well as setting up optimized server

docs/docs/plugins.md

@@ -13,7 +13,7 @@ How to use?
 Export function for browser/node/ssr. Link to lifecycle APIs doc.
 
 Show several examples of simple plugins (query for them directly — add a
-utf8 field to typegen-file to pull in utf8 string of file. This would
+utf8 field to File nodes to pull in utf8 string of file. This would
 mean converting this file into a JS component).
 
 ## Official plugins
@@ -34,14 +34,13 @@ mean converting this file into a JS component).
 * [gatsby-plugin-typescript](/docs/packages/gatsby-plugin-typescript/)
 * [gatsby-source-filesystem](/docs/packages/gatsby-source-filesystem/)
 * [gatsby-source-drupal](/docs/packages/gatsby-source-drupal/)
-* [gatsby-typegen-remark](/docs/packages/gatsby-typegen-remark/)
-* [gatsby-typegen-remark-autolink-headers](/docs/packages/gatsby-typegen-remark-autolink-headers/)
-* [gatsby-typegen-remark-copy-linked-files](/docs/packages/gatsby-typegen-remark-copy-linked-files/)
-* [gatsby-typegen-remark-prismjs](/docs/packages/gatsby-typegen-remark-prismjs/)
-* [gatsby-typegen-remark-responsive-iframe](/docs/packages/gatsby-typegen-remark-responsive-iframe/)
-* [gatsby-typegen-remark-responsive-image](/docs/packages/gatsby-typegen-remark-responsive-image/)
-* [gatsby-typegen-remark-smartypants](/docs/packages/gatsby-typegen-remark-smartypants/)
-* [gatsby-typegen-sharp](/docs/packages/gatsby-typegen-sharp/)
+* [gatsby-remark-autolink-headers](/docs/packages/gatsby-remark-autolink-headers/)
+* [gatsby-remark-copy-linked-files](/docs/packages/gatsby-remark-copy-linked-files/)
+* [gatsby-remark-prismjs](/docs/packages/gatsby-remark-prismjs/)
+* [gatsby-remark-responsive-iframe](/docs/packages/gatsby-remark-responsive-iframe/)
+* [gatsby-remark-responsive-image](/docs/packages/gatsby-remark-responsive-image/)
+* [gatsby-remark-smartypants](/docs/packages/gatsby-remark-smartypants/)
+* [gatsby-sharp](/docs/packages/gatsby-sharp/)
 
 ## Official components
 

docs/docs/querying-with-graphql.md

@@ -14,7 +14,7 @@ requirements of component.
 * Some basic terminology
   * Types based on file type + way data can be transformed
   * Connections
-  * Shallow intro to how data layer works e.g. parsers, typegens.
+  * Shallow intro to how data layer works e.g. source and transformer plugins.
   * Compare to Webpack loaders — like loaders except create schema that
   can then be queried.
 * Example queries showing off sorting, filtering, picking fields,

examples/gatsbygram/gatsby-config.js

@@ -29,14 +29,11 @@ module.exports = {
     `gatsby-plugin-sharp`,
     // This plugin identifies file nodes that are images and
     // transforms these to create new “ImageSharp” nodes.
+    // With them you can resize images and
+    // generate responsive image thumbnails.
     `gatsby-transformer-sharp`,
     // This plugin transforms JSON file nodes.
     `gatsby-transformer-json`,
-    `gatsby-typegen-filesystem`,
-    // This plugin adds GraphQL fields to the ImageSharp
-    // GraphQL type. With them you can resize images and
-    // generate sets of responsive images.
-    `gatsby-typegen-sharp`,
     // This plugin sets up the popular css-in-js library
     // Glamor. It handles adding a Babel plugin and webpack
     // configuration as well as setting up optimized server

examples/gatsbygram/package.json

@@ -15,8 +15,6 @@
     "gatsby-source-filesystem": "canary",
     "gatsby-transformer-json": "canary",
     "gatsby-transformer-sharp": "canary",
-    "gatsby-typegen-filesystem": "canary",
-    "gatsby-typegen-sharp": "canary",
     "instagram-screen-scrape": "^2.0.0",
     "lodash": "^4.16.4",
     "mkdirp": "^0.5.1",

packages/gatsby-dev-cli/README.md

@@ -41,7 +41,7 @@ be found [here](https://www.gatsbyjs.org/docs/how-to-contribute/).
 You can prevent the automatic dependencies scan and instead specify a list of
 packages you want to link by using the `--packages` option:
 
-`gatsby-dev --packages gatsby gatsby-typegen-remark`
+`gatsby-dev --packages gatsby gatsby-transformer-remark`
 
 #### `--scan-once`
 

packages/gatsby-dev-cli/src/index.js

@@ -67,7 +67,7 @@ You haven't got any gatsby dependencies into your current package.json
 You probably want to pass in a list of packages to start
 developing on! For example:
 
-gatsby-dev --packages gatsby gatsby-typegen-remark
+gatsby-dev --packages gatsby gatsby-transformer-remark
 
 If you prefer to place them in your package.json dependencies instead,
 gatsby-dev will pick them up.

packages/gatsby-typegen-remark-autolink-headers/README.md → packages/gatsby-remark-autolink-headers/README.md

@@ -1,21 +1,21 @@
-# gatsby-typegen-remark-autolink-headers
+# gatsby-remark-autolink-headers
 
 Adds Github-style links to `MarkdownRemark` headers.
 
 ## Install
 
-`npm install --save gatsby-typegen-remark-autolink-headers`
+`npm install --save gatsby-remark-autolink-headers`
 
 ## How to use
 
 ```javascript
 // In your gatsby-config.js
 plugins: [
   {
-    resolve: `gatsby-typegen-remark`,
+    resolve: `gatsby-transformer-remark`,
     options: {
       plugins: [
-        `gatsby-typegen-remark-autolink-headers`,
+        `gatsby-remark-autolink-headers`,
       ]
     }
   }

packages/gatsby-typegen-remark-autolink-headers/package.json → packages/gatsby-remark-autolink-headers/package.json

@@ -1,6 +1,6 @@
 {
-  "name": "gatsby-typegen-remark-autolink-headers",
-  "description": "Gatsby plugin for Remark to autolink headers",
+  "name": "gatsby-remark-autolink-headers",
+  "description": "Gatsby plugin to autolink headers in markdown processed by Remark",
   "version": "1.0.0-alpha13",
   "author": "Kyle Mathews <mathews.kyle@gmail.com>",
   "dependencies": {

packages/gatsby-typegen-remark-copy-linked-files/README.md → packages/gatsby-remark-copy-linked-files/README.md

@@ -1,21 +1,21 @@
-# gatsby-typegen-remark-copy-linked-files
+# gatsby-remark-copy-linked-files
 
 Copies files linked to from markdown to your `public` folder.
 
 ## Install
 
-`npm install --save gatsby-typegen-remark-copy-linked-files`
+`npm install --save gatsby-remark-copy-linked-files`
 
 ## How to use
 
 ```javascript
 // In your gatsby-config.js
 plugins: [
   {
-    resolve: `gatsby-typegen-remark`,
+    resolve: `gatsby-transformer-remark`,
     options: {
       plugins: [
-        `gatsby-typegen-remark-copy-linked-files`,
+        `gatsby-remark-copy-linked-files`,
       ]
     }
   }

packages/gatsby-typegen-remark-copy-linked-files/package.json → packages/gatsby-remark-copy-linked-files/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "gatsby-typegen-remark-copy-linked-files",
+  "name": "gatsby-remark-copy-linked-files",
   "description": "Find files which are linked to from markdown and copy them to the public directory",
   "version": "1.0.0-alpha13",
   "author": "Kyle Mathews <mathews.kyle@gmail.com>",

packages/gatsby-typegen-remark-prismjs/README.md → packages/gatsby-remark-prismjs/README.md

@@ -1,22 +1,22 @@
-# gatsby-typegen-remark-prismjs
+# gatsby-remark-prismjs
 
 Adds syntax highlighting to code blocks in markdown files using
 [PrismJS](http://prismjs.com/).
 
 ## Install
 
-`npm install --save gatsby-typegen-remark-prismjs`
+`npm install --save gatsby-remark-prismjs`
 
 ## How to use
 
 ```javascript
 // In your gatsby-config.js
 plugins: [
   {
-    resolve: `gatsby-typegen-remark`,
+    resolve: `gatsby-transformer-remark`,
     options: {
       plugins: [
-        `gatsby-typegen-remark-prismjs`,
+        `gatsby-remark-prismjs`,
       ]
     }
   }

packages/gatsby-typegen-remark-prismjs/package.json → packages/gatsby-remark-prismjs/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "gatsby-typegen-remark-prismjs",
+  "name": "gatsby-remark-prismjs",
   "description": "Adds syntax highlighting to code blocks at build time using PrismJS",
   "version": "1.0.0-alpha13",
   "author": "Kyle Mathews <mathews.kyle@gmail.com>",

packages/gatsby-typegen-remark-responsive-iframe/README.md → packages/gatsby-remark-responsive-iframe/README.md

@@ -1,23 +1,23 @@
-# gatsby-typegen-remark-responsive-iframe
+# gatsby-remark-responsive-iframe
 
 Wraps iframes (e.g. embedded YouTube videos) in markdown files in a
 responsive elastic container so the iframes always span 100% of
 the width of their container.
 
 ## Install
 
-`npm install --save gatsby-typegen-remark-responsive-iframe`
+`npm install --save gatsby-remark-responsive-iframe`
 
 ## How to use
 
 ```javascript
 // In your gatsby-config.js
 plugins: [
   {
-    resolve: `gatsby-typegen-remark`,
+    resolve: `gatsby-transformer-remark`,
     options: {
       plugins: [
-        `gatsby-typegen-remark-iframe`,
+        `gatsby-remark-iframe`,
       ]
     }
   }

packages/gatsby-typegen-remark-responsive-iframe/package.json → packages/gatsby-remark-responsive-iframe/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "gatsby-typegen-remark-responsive-iframe",
+  "name": "gatsby-remark-responsive-iframe",
   "version": "1.0.0-alpha13",
   "description": "Make iframes in Markdown processed by Remark responsive",
   "main": "index.js",

packages/gatsby-typegen-remark-responsive-image/README.md → packages/gatsby-remark-responsive-image/README.md

@@ -1,4 +1,4 @@
-# gatsby-typegen-remark-responsive-image
+# gatsby-remark-responsive-image
 
 Make images in markdown responsive by:
 
@@ -16,19 +16,19 @@ until the actual image is downloaded.
 
 ## Install
 
-`npm install --save gatsby-typegen-remark-responsive-image`
+`npm install --save gatsby-remark-responsive-image`
 
 ## How to use
 
 ```javascript
 // In your gatsby-config.js
 plugins: [
   {
-    resolve: `gatsby-typegen-remark`,
+    resolve: `gatsby-transformer-remark`,
     options: {
       plugins: [
         {
-          resolve: `gatsby-typegen-remark-responsive-image`,
+          resolve: `gatsby-remark-responsive-image`,
           options: {
             // It's important to specify the maxWidth (in pixels) of
             // the content container as this plugin uses this as the

packages/gatsby-typegen-remark-responsive-image/package.json → packages/gatsby-remark-responsive-image/package.json

@@ -1,7 +1,7 @@
 {
-  "name": "gatsby-typegen-remark-responsive-image",
+  "name": "gatsby-remark-responsive-image",
   "version": "1.0.0-alpha13",
-  "description": "Auto creates responsive images for your markdown files",
+  "description": "Create responsive image thumbnails for your images used in your markdown",
   "main": "index.js",
   "keywords": [
     "gatsby",

packages/gatsby-typegen-remark-smartypants/README.md → packages/gatsby-remark-smartypants/README.md

@@ -1,23 +1,23 @@
-# gatsby-typegen-remark-smartypants
+# gatsby-remark-smartypants
 
 Replaces “dumb” punctuation marks with “smart” punctuation marks using
 the [remark-smartypants](https://github.com/wooorm/retext-smartypants)
 plugin.
 
 ## Install
 
-`npm install --save gatsby-typegen-remark-smartypants`
+`npm install --save gatsby-remark-smartypants`
 
 ## How to use
 
 ```javascript
 // In your gatsby-config.js
 plugins: [
   {
-    resolve: `gatsby-typegen-remark`,
+    resolve: `gatsby-transformer-remark`,
     options: {
       plugins: [
-        `gatsby-typegen-remark-smartypants`,
+        `gatsby-remark-smartypants`,
       ]
     }
   }

packages/gatsby-typegen-remark-smartypants/package.json → packages/gatsby-remark-smartypants/package.json

@@ -1,7 +1,7 @@
 {
-  "name": "gatsby-typegen-remark-smartypants",
+  "name": "gatsby-remark-smartypants",
   "version": "1.0.0-alpha13",
-  "description": "Use retext-smartypants to auto-enhance typography of Markdown",
+  "description": "Use retext-smartypants to auto-enhance typography of markdown",
   "main": "index.js",
   "scripts": {
     "build": "babel src --out-dir .",

packages/gatsby-transformer-react-docgen/README.md

@@ -0,0 +1 @@
+# gatsby-transformer-react-docgen

packages/gatsby-typegen-react-docgen/package.json → packages/gatsby-transformer-react-docgen/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "gatsby-typegen-react-docgen",
+  "name": "gatsby-transformer-react-docgen",
   "version": "1.0.0-alpha13",
   "description": "Expose React component metadata and prop information as GraphQL types",
   "main": "index.js",
@@ -26,4 +26,4 @@
     "graphql-type-json": "^0.1.4",
     "react-docgen": "^2.14.1"
   }
-}
+}

packages/gatsby-transformer-remark/.gitignore

@@ -1 +1,3 @@
 /gatsby-node.js
+/extend-node-type.js
+/on-node-create.js

packages/gatsby-transformer-remark/README.md

@@ -33,7 +33,7 @@ Each Markdown file is parsed into a node of type `MarkdownRemark`.
 All frontmatter fields are converted into GraphQL fields. TODO link to
 docs on auto-inferring types/fields.
 
-`gatsby-typegen-remark` adds additional fields to the `MarkdownRemark`
+This plugin adds additional fields to the `MarkdownRemark`
 GraphQL type including `html`, `excerpt`, `headers`, etc. Other Gatsby
 plugins can also add additional fields.
 

packages/gatsby-transformer-remark/package.json

@@ -1,10 +1,19 @@
 {
   "name": "gatsby-transformer-remark",
-  "description": "Gatsby transformer plugin for Remark",
+  "description": "Gatsby transformer plugin for Markdown using the Remark library and ecosystem",
   "version": "1.0.0-alpha13",
   "author": "Kyle Mathews <mathews.kyle@gmail.com>",
   "dependencies": {
-    "gray-matter": "^2.1.0"
+    "bluebird": "^3.5.0",
+    "gray-matter": "^2.1.0",
+    "hast-util-to-html": "^3.0.0",
+    "lodash": "^4.17.4",
+    "mdast-util-to-hast": "^2.4.0",
+    "remark": "^7.0.1",
+    "sanitize-html": "^1.14.1",
+    "underscore.string": "^3.3.4",
+    "unist-util-select": "^1.5.0",
+    "unist-util-visit": "^1.1.1"
   },
   "devDependencies": {
     "babel-cli": "^6.24.1",