From 4803d610547ed12d55d07e2165f3ea4de822fbf2 Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Tue, 3 Jul 2018 17:07:20 -0700
Subject: [PATCH 01/15] First try at cleaning up build output

---
 packages/gatsby/cache-dir/static-entry.js    | 12 ++++++----
 packages/gatsby/src/bootstrap/index.js       |  2 ++
 packages/gatsby/src/commands/build-html.js   |  2 +-
 packages/gatsby/src/commands/develop-html.js |  2 +-
 packages/gatsby/src/utils/webpack.config.js  | 25 ++++++++++----------
 5 files changed, 24 insertions(+), 19 deletions(-)

diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index b677047053c28..4288573f4da5d 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -193,6 +193,7 @@ export default (pagePath, callback) => {
   const scripts = scriptsAndStyles.filter(
     script => script.name && script.name.endsWith(`.js`)
   )
+
   const styles = scriptsAndStyles.filter(
     style => style.name && style.name.endsWith(`.css`)
   )
@@ -221,7 +222,7 @@ export default (pagePath, callback) => {
           as="script"
           rel={script.rel}
           key={script.name}
-          href={urlJoin(pathPrefix, script.name)}
+          href={urlJoin(`scripts`, pathPrefix, script.name)}
         />
       )
     })
@@ -252,7 +253,7 @@ export default (pagePath, callback) => {
             as="style"
             rel={style.rel}
             key={style.name}
-            href={urlJoin(pathPrefix, style.name)}
+            href={urlJoin(`styles`, pathPrefix, style.name)}
           />
         )
       } else {
@@ -262,7 +263,7 @@ export default (pagePath, callback) => {
             data-href={urlJoin(pathPrefix, style.name)}
             dangerouslySetInnerHTML={{
               __html: fs.readFileSync(
-                join(process.cwd(), `public`, style.name),
+                join(process.cwd(), `public`, `styles`, style.name),
                 `utf-8`
               ),
             }}
@@ -291,7 +292,10 @@ export default (pagePath, callback) => {
   // Filter out prefetched bundles as adding them as a script tag
   // would force high priority fetching.
   const bodyScripts = scripts.filter(s => s.rel !== `prefetch`).map(s => {
-    const scriptPath = `${pathPrefix}${JSON.stringify(s.name).slice(1, -1)}`
+    const scriptPath = `/scripts${pathPrefix}${JSON.stringify(s.name).slice(
+      1,
+      -1
+    )}`
     return <script key={scriptPath} src={scriptPath} async />
   })
 
diff --git a/packages/gatsby/src/bootstrap/index.js b/packages/gatsby/src/bootstrap/index.js
index 7ae341d6b0fd3..d17721f1bb2b9 100644
--- a/packages/gatsby/src/bootstrap/index.js
+++ b/packages/gatsby/src/bootstrap/index.js
@@ -93,6 +93,8 @@ module.exports = async (args: BootstrapArgs) => {
   await del([
     `public/*.{html,css}`,
     `public/**/*.{html,css}`,
+    `public/scripts`,
+    `public/styles`,
     `!public/static`,
     `!public/static/**/*.{html,css}`,
   ])
diff --git a/packages/gatsby/src/commands/build-html.js b/packages/gatsby/src/commands/build-html.js
index a7af8fee9a0f1..b8a0238e6d2c5 100644
--- a/packages/gatsby/src/commands/build-html.js
+++ b/packages/gatsby/src/commands/build-html.js
@@ -28,7 +28,7 @@ module.exports = async (program: any) => {
       if (e) {
         return reject(e)
       }
-      const outputFile = `${directory}/public/render-page.js`
+      const outputFile = `${directory}/public/scripts/render-page.js`
       if (stats.hasErrors()) {
         let webpackErrors = stats.toJson().errors.filter(Boolean)
         return reject(
diff --git a/packages/gatsby/src/commands/develop-html.js b/packages/gatsby/src/commands/develop-html.js
index a4c1a2c440029..9b1b80bb6b2f0 100644
--- a/packages/gatsby/src/commands/develop-html.js
+++ b/packages/gatsby/src/commands/develop-html.js
@@ -24,7 +24,7 @@ module.exports = async (program: any) => {
       if (e) {
         return reject(e)
       }
-      const outputFile = `${directory}/public/render-page.js`
+      const outputFile = `${directory}/public/scripts/render-page.js`
       if (stats.hasErrors()) {
         let webpackErrors = stats.toJson().errors
         console.log(`here`, webpackErrors[0])
diff --git a/packages/gatsby/src/utils/webpack.config.js b/packages/gatsby/src/utils/webpack.config.js
index 6e7965e06e49c..b08f48ed1a508 100644
--- a/packages/gatsby/src/utils/webpack.config.js
+++ b/packages/gatsby/src/utils/webpack.config.js
@@ -109,24 +109,24 @@ module.exports = async (
         // A temp file required by static-site-generator-plugin. See plugins() below.
         // Deleted by build-html.js, since it's not needed for production.
         return {
-          path: directoryPath(`public`),
           filename: `render-page.js`,
           libraryTarget: `umd`,
           library: `lib`,
           umdNamedDefine: true,
           globalObject: `this`,
+          path: directoryPath(`public/scripts`),
           publicPath: program.prefixPaths
-            ? `${store.getState().config.pathPrefix}/`
-            : `/`,
+            ? `/scripts${store.getState().config.pathPrefix}/`
+            : `/scripts/`,
         }
       case `build-javascript`:
         return {
           filename: `[name]-[chunkhash].js`,
           chunkFilename: `[name]-[chunkhash].js`,
-          path: directoryPath(`public`),
+          path: directoryPath(`public/scripts`),
           publicPath: program.prefixPaths
-            ? `${store.getState().config.pathPrefix}/`
-            : `/`,
+            ? `/scripts${store.getState().config.pathPrefix}/`
+            : `/scripts/`,
         }
       default:
         throw new Error(`The state requested ${stage} doesn't exist.`)
@@ -186,12 +186,12 @@ module.exports = async (
             clearConsole: false,
             compilationSuccessInfo: {
               messages: [
-                `You can now view your site in the browser running at ${program.ssl ? `https` : `http`}://${
-                  program.host
-                }:${program.port}`,
-                `Your graphql debugger is running at ${program.ssl ? `https` : `http`}://${program.host}:${
-                  program.port
-                }/___graphql`,
+                `You can now view your site in the browser running at ${
+                  program.ssl ? `https` : `http`
+                }://${program.host}:${program.port}`,
+                `Your graphql debugger is running at ${
+                  program.ssl ? `https` : `http`
+                }://${program.host}:${program.port}/___graphql`,
               ],
             },
           }),
@@ -227,7 +227,6 @@ module.exports = async (
                       )
                     }
                   }
-
                   const webpackStats = {
                     ...stats.toJson({ all: false, chunkGroups: true }),
                     assetsByChunkName: assets,

From e1b8be9046a9e5d36c69e45327f63831fae99e8a Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Wed, 4 Jul 2018 11:23:07 -0700
Subject: [PATCH 02/15] Adding flag to build, ordering pathPrefix correctly,
 and cleaned up styles/script paths.

---
 packages/gatsby-cli/src/create-cli.js        | 16 ++++++---
 packages/gatsby/cache-dir/.eslintrc.json     |  3 +-
 packages/gatsby/cache-dir/static-entry.js    | 18 ++++++----
 packages/gatsby/src/commands/build-html.js   |  8 +++--
 packages/gatsby/src/commands/develop-html.js |  8 +++--
 packages/gatsby/src/utils/webpack.config.js  | 35 +++++++++++++++-----
 6 files changed, 62 insertions(+), 26 deletions(-)

diff --git a/packages/gatsby-cli/src/create-cli.js b/packages/gatsby-cli/src/create-cli.js
index b00f613eb0e21..615e87b4f5357 100644
--- a/packages/gatsby-cli/src/create-cli.js
+++ b/packages/gatsby-cli/src/create-cli.js
@@ -137,11 +137,17 @@ function buildLocalCommands(cli, isLocalSite) {
         type: `boolean`,
         default: false,
         describe: `Build site with link paths prefixed (set prefix in your config).`,
-      }).option(`no-uglify`, {
-        type: `boolean`,
-        default: false,
-        describe: `Build site without uglifying JS bundles (for debugging).`,
-      }),
+      })
+        .option(`no-uglify`, {
+          type: `boolean`,
+          default: false,
+          describe: `Build site without uglifying JS bundles (for debugging).`,
+        })
+        .option(`group-files`, {
+          type: `boolean`,
+          default: false,
+          describe: `Build site with grouping of files in subdirectories.`,
+        }),
     handler: handlerP(
       getCommandHandler(`build`, (args, cmd) => {
         process.env.NODE_ENV = `production`
diff --git a/packages/gatsby/cache-dir/.eslintrc.json b/packages/gatsby/cache-dir/.eslintrc.json
index 9352bcdc0dc2e..97ef499c07ae7 100644
--- a/packages/gatsby/cache-dir/.eslintrc.json
+++ b/packages/gatsby/cache-dir/.eslintrc.json
@@ -4,6 +4,7 @@
   },
   "globals": {
     "__PATH_PREFIX__": false,
+    "__GROUP_FILES__": false,
     "___emitter": false
   }
-}
\ No newline at end of file
+}
diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index 4288573f4da5d..7df6e4577c6ba 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -55,6 +55,11 @@ const createElement = React.createElement
 export default (pagePath, callback) => {
   const pathPrefix = `${__PATH_PREFIX__}/`
 
+  // If enabled, group files in their respective folders otherwise generated
+  // non-static files will be left in the root of the output directory.
+  const pathToGroupStyles = __GROUP_FILES__ ? `styles/` : ``
+  const pathToGroupScripts = __GROUP_FILES__ ? `scripts/` : ``
+
   let bodyHtml = ``
   let headComponents = []
   let htmlAttributes = {}
@@ -222,7 +227,7 @@ export default (pagePath, callback) => {
           as="script"
           rel={script.rel}
           key={script.name}
-          href={urlJoin(`scripts`, pathPrefix, script.name)}
+          href={urlJoin(pathPrefix, pathToGroupScripts, script.name)}
         />
       )
     })
@@ -253,7 +258,7 @@ export default (pagePath, callback) => {
             as="style"
             rel={style.rel}
             key={style.name}
-            href={urlJoin(`styles`, pathPrefix, style.name)}
+            href={urlJoin(pathPrefix, pathToGroupStyles, style.name)}
           />
         )
       } else {
@@ -263,7 +268,7 @@ export default (pagePath, callback) => {
             data-href={urlJoin(pathPrefix, style.name)}
             dangerouslySetInnerHTML={{
               __html: fs.readFileSync(
-                join(process.cwd(), `public`, `styles`, style.name),
+                join(process.cwd(), `public`, pathToGroupStyles, style.name),
                 `utf-8`
               ),
             }}
@@ -292,10 +297,9 @@ export default (pagePath, callback) => {
   // Filter out prefetched bundles as adding them as a script tag
   // would force high priority fetching.
   const bodyScripts = scripts.filter(s => s.rel !== `prefetch`).map(s => {
-    const scriptPath = `/scripts${pathPrefix}${JSON.stringify(s.name).slice(
-      1,
-      -1
-    )}`
+    const scriptPath = `${pathPrefix}${pathToGroupScripts}${JSON.stringify(
+      s.name
+    ).slice(1, -1)}`
     return <script key={scriptPath} src={scriptPath} async />
   })
 
diff --git a/packages/gatsby/src/commands/build-html.js b/packages/gatsby/src/commands/build-html.js
index b8a0238e6d2c5..c6a3878cf95eb 100644
--- a/packages/gatsby/src/commands/build-html.js
+++ b/packages/gatsby/src/commands/build-html.js
@@ -9,7 +9,7 @@ const { createErrorFromString } = require(`gatsby-cli/lib/reporter/errors`)
 const renderHTML = require(`../utils/html-renderer`)
 
 module.exports = async (program: any) => {
-  const { directory } = program
+  const { directory, groupFiles } = program
 
   debug(`generating static HTML`)
   // Reduce pages objects to an array of paths.
@@ -28,7 +28,11 @@ module.exports = async (program: any) => {
       if (e) {
         return reject(e)
       }
-      const outputFile = `${directory}/public/scripts/render-page.js`
+
+      const outputFile = groupFiles
+        ? `${directory}/public/scripts/render-page.js`
+        : `${directory}/public/render-page.js`
+
       if (stats.hasErrors()) {
         let webpackErrors = stats.toJson().errors.filter(Boolean)
         return reject(
diff --git a/packages/gatsby/src/commands/develop-html.js b/packages/gatsby/src/commands/develop-html.js
index 9b1b80bb6b2f0..3ff8d17e84f13 100644
--- a/packages/gatsby/src/commands/develop-html.js
+++ b/packages/gatsby/src/commands/develop-html.js
@@ -7,7 +7,7 @@ const webpackConfig = require(`../utils/webpack.config`)
 const renderHTML = require(`../utils/html-renderer`)
 
 module.exports = async (program: any) => {
-  const { directory } = program
+  const { directory, groupFiles } = program
 
   debug(`generating static HTML`)
 
@@ -24,7 +24,11 @@ module.exports = async (program: any) => {
       if (e) {
         return reject(e)
       }
-      const outputFile = `${directory}/public/scripts/render-page.js`
+
+      const outputFile = groupFiles
+        ? `${directory}/public/scripts/render-page.js`
+        : `${directory}/public/render-page.js`
+
       if (stats.hasErrors()) {
         let webpackErrors = stats.toJson().errors
         console.log(`here`, webpackErrors[0])
diff --git a/packages/gatsby/src/utils/webpack.config.js b/packages/gatsby/src/utils/webpack.config.js
index b08f48ed1a508..d1345016cb0e1 100644
--- a/packages/gatsby/src/utils/webpack.config.js
+++ b/packages/gatsby/src/utils/webpack.config.js
@@ -86,6 +86,25 @@ module.exports = async (
     return hmrBasePath + hmrSuffix
   }
 
+  function getOutputPaths() {
+    const path = program.groupFiles
+      ? directoryPath(`public/scripts`)
+      : directoryPath(`public`)
+
+    let publicPath = program.prefixPaths
+      ? `${store.getState().config.pathPrefix}/`
+      : `/`
+
+    if (program.groupFiles) {
+      publicPath = `${publicPath}scripts/`
+    }
+
+    return {
+      path,
+      publicPath,
+    }
+  }
+
   debug(`Loading webpack config for stage "${stage}"`)
   function getOutput() {
     switch (stage) {
@@ -114,19 +133,15 @@ module.exports = async (
           library: `lib`,
           umdNamedDefine: true,
           globalObject: `this`,
-          path: directoryPath(`public/scripts`),
-          publicPath: program.prefixPaths
-            ? `/scripts${store.getState().config.pathPrefix}/`
-            : `/scripts/`,
+          path: getOutputPaths().path,
+          publicPath: getOutputPaths().publicPath,
         }
       case `build-javascript`:
         return {
           filename: `[name]-[chunkhash].js`,
           chunkFilename: `[name]-[chunkhash].js`,
-          path: directoryPath(`public/scripts`),
-          publicPath: program.prefixPaths
-            ? `/scripts${store.getState().config.pathPrefix}/`
-            : `/scripts/`,
+          path: getOutputPaths().path,
+          publicPath: getOutputPaths().publicPath,
         }
       default:
         throw new Error(`The state requested ${stage} doesn't exist.`)
@@ -167,12 +182,14 @@ module.exports = async (
       plugins.moment(),
 
       // Add a few global variables. Set NODE_ENV to production (enables
-      // optimizations for React) and what the link prefix is (__PATH_PREFIX__).
+      // optimizations for React), what the link prefix is (__PATH_PREFIX__),
+      // and __GROUP_FILES__ to organize output files.
       plugins.define({
         "process.env": processEnv(stage, `development`),
         __PATH_PREFIX__: JSON.stringify(
           program.prefixPaths ? store.getState().config.pathPrefix : ``
         ),
+        __GROUP_FILES__: !!program.groupFiles,
       }),
     ]
 

From 77371b9c447b3488b1a89e7280a7c70f8cbb65ce Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Wed, 4 Jul 2018 11:50:04 -0700
Subject: [PATCH 03/15] Removing the deletion of files as referenced by
 m-allanson and pieh

---
 packages/gatsby/src/bootstrap/index.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/packages/gatsby/src/bootstrap/index.js b/packages/gatsby/src/bootstrap/index.js
index d17721f1bb2b9..7ae341d6b0fd3 100644
--- a/packages/gatsby/src/bootstrap/index.js
+++ b/packages/gatsby/src/bootstrap/index.js
@@ -93,8 +93,6 @@ module.exports = async (args: BootstrapArgs) => {
   await del([
     `public/*.{html,css}`,
     `public/**/*.{html,css}`,
-    `public/scripts`,
-    `public/styles`,
     `!public/static`,
     `!public/static/**/*.{html,css}`,
   ])

From 59cf18a3ba6726fa65f96183a8d671c0d71cc54f Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Wed, 4 Jul 2018 16:33:36 -0700
Subject: [PATCH 04/15] Adding support for styles grouping

---
 packages/gatsby/cache-dir/static-entry.js  |  9 +++++++--
 packages/gatsby/src/utils/webpack-utils.js | 11 +++++++----
 2 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index 7df6e4577c6ba..9b060446225c4 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -249,9 +249,14 @@ export default (pagePath, callback) => {
     .slice(0)
     .reverse()
     .forEach(style => {
+      // Cleaning up style path for grouping option
+      let dataHrefStyleName = style.name
+      if (style.name.substr(0, 3) === `../`) {
+        dataHrefStyleName = style.name.slice(2)
+      }
+
       // Add <link>s for styles that should be prefetched
       // otherwise, inline as a <style> tag
-
       if (style.rel === `prefetch`) {
         headComponents.push(
           <link
@@ -265,7 +270,7 @@ export default (pagePath, callback) => {
         headComponents.unshift(
           <style
             type="text/css"
-            data-href={urlJoin(pathPrefix, style.name)}
+            data-href={urlJoin(pathPrefix, dataHrefStyleName)}
             dangerouslySetInnerHTML={{
               __html: fs.readFileSync(
                 join(process.cwd(), `public`, pathToGroupStyles, style.name),
diff --git a/packages/gatsby/src/utils/webpack-utils.js b/packages/gatsby/src/utils/webpack-utils.js
index 4c9151f6d8e86..b36cf8b29f6fe 100644
--- a/packages/gatsby/src/utils/webpack-utils.js
+++ b/packages/gatsby/src/utils/webpack-utils.js
@@ -428,12 +428,15 @@ module.exports = async ({
    * Extracts css requires into a single file;
    * includes some reasonable defaults
    */
-  plugins.extractText = options =>
-    new MiniCssExtractPlugin({
-      filename: `[name].[contenthash].css`,
-      chunkFilename: `[name].[contenthash].css`,
+  plugins.extractText = options => {
+    const pathToGroupStyles = program.groupFiles ? `../styles/` : ``
+
+    return new MiniCssExtractPlugin({
+      filename: `${pathToGroupStyles}[name].[contenthash].css`,
+      chunkFilename: `${pathToGroupStyles}[name].[contenthash].css`,
       ...options,
     })
+  }
 
   plugins.moment = () => plugins.ignore(/^\.\/locale$/, /moment$/)
 

From 366bd9785a578e78614b2b3ea1565f51cba19234 Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Fri, 6 Jul 2018 10:19:57 -0700
Subject: [PATCH 05/15] renaming output directories to js and css

---
 packages/gatsby/cache-dir/static-entry.js    | 4 ++--
 packages/gatsby/src/commands/build-html.js   | 2 +-
 packages/gatsby/src/commands/develop-html.js | 2 +-
 packages/gatsby/src/utils/webpack-utils.js   | 2 +-
 packages/gatsby/src/utils/webpack.config.js  | 4 ++--
 5 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index 9b060446225c4..0a1362f05298f 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -57,8 +57,8 @@ export default (pagePath, callback) => {
 
   // If enabled, group files in their respective folders otherwise generated
   // non-static files will be left in the root of the output directory.
-  const pathToGroupStyles = __GROUP_FILES__ ? `styles/` : ``
-  const pathToGroupScripts = __GROUP_FILES__ ? `scripts/` : ``
+  const pathToGroupStyles = __GROUP_FILES__ ? `css/` : ``
+  const pathToGroupScripts = __GROUP_FILES__ ? `js/` : ``
 
   let bodyHtml = ``
   let headComponents = []
diff --git a/packages/gatsby/src/commands/build-html.js b/packages/gatsby/src/commands/build-html.js
index c6a3878cf95eb..d2c3e4c182861 100644
--- a/packages/gatsby/src/commands/build-html.js
+++ b/packages/gatsby/src/commands/build-html.js
@@ -30,7 +30,7 @@ module.exports = async (program: any) => {
       }
 
       const outputFile = groupFiles
-        ? `${directory}/public/scripts/render-page.js`
+        ? `${directory}/public/js/render-page.js`
         : `${directory}/public/render-page.js`
 
       if (stats.hasErrors()) {
diff --git a/packages/gatsby/src/commands/develop-html.js b/packages/gatsby/src/commands/develop-html.js
index 3ff8d17e84f13..e22a7724cccae 100644
--- a/packages/gatsby/src/commands/develop-html.js
+++ b/packages/gatsby/src/commands/develop-html.js
@@ -26,7 +26,7 @@ module.exports = async (program: any) => {
       }
 
       const outputFile = groupFiles
-        ? `${directory}/public/scripts/render-page.js`
+        ? `${directory}/public/js/render-page.js`
         : `${directory}/public/render-page.js`
 
       if (stats.hasErrors()) {
diff --git a/packages/gatsby/src/utils/webpack-utils.js b/packages/gatsby/src/utils/webpack-utils.js
index b36cf8b29f6fe..00c21d1d27da1 100644
--- a/packages/gatsby/src/utils/webpack-utils.js
+++ b/packages/gatsby/src/utils/webpack-utils.js
@@ -429,7 +429,7 @@ module.exports = async ({
    * includes some reasonable defaults
    */
   plugins.extractText = options => {
-    const pathToGroupStyles = program.groupFiles ? `../styles/` : ``
+    const pathToGroupStyles = program.groupFiles ? `../css/` : ``
 
     return new MiniCssExtractPlugin({
       filename: `${pathToGroupStyles}[name].[contenthash].css`,
diff --git a/packages/gatsby/src/utils/webpack.config.js b/packages/gatsby/src/utils/webpack.config.js
index d1345016cb0e1..ecd77e75b8125 100644
--- a/packages/gatsby/src/utils/webpack.config.js
+++ b/packages/gatsby/src/utils/webpack.config.js
@@ -88,7 +88,7 @@ module.exports = async (
 
   function getOutputPaths() {
     const path = program.groupFiles
-      ? directoryPath(`public/scripts`)
+      ? directoryPath(`public/js`)
       : directoryPath(`public`)
 
     let publicPath = program.prefixPaths
@@ -96,7 +96,7 @@ module.exports = async (
       : `/`
 
     if (program.groupFiles) {
-      publicPath = `${publicPath}scripts/`
+      publicPath = `${publicPath}js/`
     }
 
     return {

From 972fb6bcb13a89d970f0254fbd3ffc20e367ad2e Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Tue, 3 Jul 2018 17:07:20 -0700
Subject: [PATCH 06/15] First try at cleaning up build output

---
 packages/gatsby/cache-dir/static-entry.js    | 12 ++++++++----
 packages/gatsby/src/bootstrap/index.js       |  2 ++
 packages/gatsby/src/commands/build-html.js   |  2 +-
 packages/gatsby/src/commands/develop-html.js |  2 +-
 packages/gatsby/src/utils/webpack.config.js  | 13 ++++++-------
 5 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index b677047053c28..4288573f4da5d 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -193,6 +193,7 @@ export default (pagePath, callback) => {
   const scripts = scriptsAndStyles.filter(
     script => script.name && script.name.endsWith(`.js`)
   )
+
   const styles = scriptsAndStyles.filter(
     style => style.name && style.name.endsWith(`.css`)
   )
@@ -221,7 +222,7 @@ export default (pagePath, callback) => {
           as="script"
           rel={script.rel}
           key={script.name}
-          href={urlJoin(pathPrefix, script.name)}
+          href={urlJoin(`scripts`, pathPrefix, script.name)}
         />
       )
     })
@@ -252,7 +253,7 @@ export default (pagePath, callback) => {
             as="style"
             rel={style.rel}
             key={style.name}
-            href={urlJoin(pathPrefix, style.name)}
+            href={urlJoin(`styles`, pathPrefix, style.name)}
           />
         )
       } else {
@@ -262,7 +263,7 @@ export default (pagePath, callback) => {
             data-href={urlJoin(pathPrefix, style.name)}
             dangerouslySetInnerHTML={{
               __html: fs.readFileSync(
-                join(process.cwd(), `public`, style.name),
+                join(process.cwd(), `public`, `styles`, style.name),
                 `utf-8`
               ),
             }}
@@ -291,7 +292,10 @@ export default (pagePath, callback) => {
   // Filter out prefetched bundles as adding them as a script tag
   // would force high priority fetching.
   const bodyScripts = scripts.filter(s => s.rel !== `prefetch`).map(s => {
-    const scriptPath = `${pathPrefix}${JSON.stringify(s.name).slice(1, -1)}`
+    const scriptPath = `/scripts${pathPrefix}${JSON.stringify(s.name).slice(
+      1,
+      -1
+    )}`
     return <script key={scriptPath} src={scriptPath} async />
   })
 
diff --git a/packages/gatsby/src/bootstrap/index.js b/packages/gatsby/src/bootstrap/index.js
index 7290251e904cd..d1af5ef033181 100644
--- a/packages/gatsby/src/bootstrap/index.js
+++ b/packages/gatsby/src/bootstrap/index.js
@@ -93,6 +93,8 @@ module.exports = async (args: BootstrapArgs) => {
   await del([
     `public/*.{html,css}`,
     `public/**/*.{html,css}`,
+    `public/scripts`,
+    `public/styles`,
     `!public/static`,
     `!public/static/**/*.{html,css}`,
   ])
diff --git a/packages/gatsby/src/commands/build-html.js b/packages/gatsby/src/commands/build-html.js
index a7af8fee9a0f1..b8a0238e6d2c5 100644
--- a/packages/gatsby/src/commands/build-html.js
+++ b/packages/gatsby/src/commands/build-html.js
@@ -28,7 +28,7 @@ module.exports = async (program: any) => {
       if (e) {
         return reject(e)
       }
-      const outputFile = `${directory}/public/render-page.js`
+      const outputFile = `${directory}/public/scripts/render-page.js`
       if (stats.hasErrors()) {
         let webpackErrors = stats.toJson().errors.filter(Boolean)
         return reject(
diff --git a/packages/gatsby/src/commands/develop-html.js b/packages/gatsby/src/commands/develop-html.js
index a4c1a2c440029..9b1b80bb6b2f0 100644
--- a/packages/gatsby/src/commands/develop-html.js
+++ b/packages/gatsby/src/commands/develop-html.js
@@ -24,7 +24,7 @@ module.exports = async (program: any) => {
       if (e) {
         return reject(e)
       }
-      const outputFile = `${directory}/public/render-page.js`
+      const outputFile = `${directory}/public/scripts/render-page.js`
       if (stats.hasErrors()) {
         let webpackErrors = stats.toJson().errors
         console.log(`here`, webpackErrors[0])
diff --git a/packages/gatsby/src/utils/webpack.config.js b/packages/gatsby/src/utils/webpack.config.js
index f513e668381ff..89c4cbd64d7bd 100644
--- a/packages/gatsby/src/utils/webpack.config.js
+++ b/packages/gatsby/src/utils/webpack.config.js
@@ -110,24 +110,24 @@ module.exports = async (
         // A temp file required by static-site-generator-plugin. See plugins() below.
         // Deleted by build-html.js, since it's not needed for production.
         return {
-          path: directoryPath(`public`),
           filename: `render-page.js`,
           libraryTarget: `umd`,
           library: `lib`,
           umdNamedDefine: true,
           globalObject: `this`,
+          path: directoryPath(`public/scripts`),
           publicPath: program.prefixPaths
-            ? `${store.getState().config.pathPrefix}/`
-            : `/`,
+            ? `/scripts${store.getState().config.pathPrefix}/`
+            : `/scripts/`,
         }
       case `build-javascript`:
         return {
           filename: `[name]-[chunkhash].js`,
           chunkFilename: `[name]-[chunkhash].js`,
-          path: directoryPath(`public`),
+          path: directoryPath(`public/scripts`),
           publicPath: program.prefixPaths
-            ? `${store.getState().config.pathPrefix}/`
-            : `/`,
+            ? `/scripts${store.getState().config.pathPrefix}/`
+            : `/scripts/`,
         }
       default:
         throw new Error(`The state requested ${stage} doesn't exist.`)
@@ -228,7 +228,6 @@ module.exports = async (
                       )
                     }
                   }
-
                   const webpackStats = {
                     ...stats.toJson({ all: false, chunkGroups: true }),
                     assetsByChunkName: assets,

From 4042ae1b5a3c1dfe82e555f2fc94730b16edef75 Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Wed, 4 Jul 2018 11:23:07 -0700
Subject: [PATCH 07/15] Adding flag to build, ordering pathPrefix correctly,
 and cleaned up styles/script paths.

---
 packages/gatsby-cli/src/create-cli.js        | 16 ++++++---
 packages/gatsby/cache-dir/.eslintrc.json     |  3 +-
 packages/gatsby/cache-dir/static-entry.js    | 18 ++++++----
 packages/gatsby/src/commands/build-html.js   |  8 +++--
 packages/gatsby/src/commands/develop-html.js |  8 +++--
 packages/gatsby/src/utils/webpack.config.js  | 35 +++++++++++++++-----
 6 files changed, 62 insertions(+), 26 deletions(-)

diff --git a/packages/gatsby-cli/src/create-cli.js b/packages/gatsby-cli/src/create-cli.js
index b00f613eb0e21..615e87b4f5357 100644
--- a/packages/gatsby-cli/src/create-cli.js
+++ b/packages/gatsby-cli/src/create-cli.js
@@ -137,11 +137,17 @@ function buildLocalCommands(cli, isLocalSite) {
         type: `boolean`,
         default: false,
         describe: `Build site with link paths prefixed (set prefix in your config).`,
-      }).option(`no-uglify`, {
-        type: `boolean`,
-        default: false,
-        describe: `Build site without uglifying JS bundles (for debugging).`,
-      }),
+      })
+        .option(`no-uglify`, {
+          type: `boolean`,
+          default: false,
+          describe: `Build site without uglifying JS bundles (for debugging).`,
+        })
+        .option(`group-files`, {
+          type: `boolean`,
+          default: false,
+          describe: `Build site with grouping of files in subdirectories.`,
+        }),
     handler: handlerP(
       getCommandHandler(`build`, (args, cmd) => {
         process.env.NODE_ENV = `production`
diff --git a/packages/gatsby/cache-dir/.eslintrc.json b/packages/gatsby/cache-dir/.eslintrc.json
index 9352bcdc0dc2e..97ef499c07ae7 100644
--- a/packages/gatsby/cache-dir/.eslintrc.json
+++ b/packages/gatsby/cache-dir/.eslintrc.json
@@ -4,6 +4,7 @@
   },
   "globals": {
     "__PATH_PREFIX__": false,
+    "__GROUP_FILES__": false,
     "___emitter": false
   }
-}
\ No newline at end of file
+}
diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index 4288573f4da5d..7df6e4577c6ba 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -55,6 +55,11 @@ const createElement = React.createElement
 export default (pagePath, callback) => {
   const pathPrefix = `${__PATH_PREFIX__}/`
 
+  // If enabled, group files in their respective folders otherwise generated
+  // non-static files will be left in the root of the output directory.
+  const pathToGroupStyles = __GROUP_FILES__ ? `styles/` : ``
+  const pathToGroupScripts = __GROUP_FILES__ ? `scripts/` : ``
+
   let bodyHtml = ``
   let headComponents = []
   let htmlAttributes = {}
@@ -222,7 +227,7 @@ export default (pagePath, callback) => {
           as="script"
           rel={script.rel}
           key={script.name}
-          href={urlJoin(`scripts`, pathPrefix, script.name)}
+          href={urlJoin(pathPrefix, pathToGroupScripts, script.name)}
         />
       )
     })
@@ -253,7 +258,7 @@ export default (pagePath, callback) => {
             as="style"
             rel={style.rel}
             key={style.name}
-            href={urlJoin(`styles`, pathPrefix, style.name)}
+            href={urlJoin(pathPrefix, pathToGroupStyles, style.name)}
           />
         )
       } else {
@@ -263,7 +268,7 @@ export default (pagePath, callback) => {
             data-href={urlJoin(pathPrefix, style.name)}
             dangerouslySetInnerHTML={{
               __html: fs.readFileSync(
-                join(process.cwd(), `public`, `styles`, style.name),
+                join(process.cwd(), `public`, pathToGroupStyles, style.name),
                 `utf-8`
               ),
             }}
@@ -292,10 +297,9 @@ export default (pagePath, callback) => {
   // Filter out prefetched bundles as adding them as a script tag
   // would force high priority fetching.
   const bodyScripts = scripts.filter(s => s.rel !== `prefetch`).map(s => {
-    const scriptPath = `/scripts${pathPrefix}${JSON.stringify(s.name).slice(
-      1,
-      -1
-    )}`
+    const scriptPath = `${pathPrefix}${pathToGroupScripts}${JSON.stringify(
+      s.name
+    ).slice(1, -1)}`
     return <script key={scriptPath} src={scriptPath} async />
   })
 
diff --git a/packages/gatsby/src/commands/build-html.js b/packages/gatsby/src/commands/build-html.js
index b8a0238e6d2c5..c6a3878cf95eb 100644
--- a/packages/gatsby/src/commands/build-html.js
+++ b/packages/gatsby/src/commands/build-html.js
@@ -9,7 +9,7 @@ const { createErrorFromString } = require(`gatsby-cli/lib/reporter/errors`)
 const renderHTML = require(`../utils/html-renderer`)
 
 module.exports = async (program: any) => {
-  const { directory } = program
+  const { directory, groupFiles } = program
 
   debug(`generating static HTML`)
   // Reduce pages objects to an array of paths.
@@ -28,7 +28,11 @@ module.exports = async (program: any) => {
       if (e) {
         return reject(e)
       }
-      const outputFile = `${directory}/public/scripts/render-page.js`
+
+      const outputFile = groupFiles
+        ? `${directory}/public/scripts/render-page.js`
+        : `${directory}/public/render-page.js`
+
       if (stats.hasErrors()) {
         let webpackErrors = stats.toJson().errors.filter(Boolean)
         return reject(
diff --git a/packages/gatsby/src/commands/develop-html.js b/packages/gatsby/src/commands/develop-html.js
index 9b1b80bb6b2f0..3ff8d17e84f13 100644
--- a/packages/gatsby/src/commands/develop-html.js
+++ b/packages/gatsby/src/commands/develop-html.js
@@ -7,7 +7,7 @@ const webpackConfig = require(`../utils/webpack.config`)
 const renderHTML = require(`../utils/html-renderer`)
 
 module.exports = async (program: any) => {
-  const { directory } = program
+  const { directory, groupFiles } = program
 
   debug(`generating static HTML`)
 
@@ -24,7 +24,11 @@ module.exports = async (program: any) => {
       if (e) {
         return reject(e)
       }
-      const outputFile = `${directory}/public/scripts/render-page.js`
+
+      const outputFile = groupFiles
+        ? `${directory}/public/scripts/render-page.js`
+        : `${directory}/public/render-page.js`
+
       if (stats.hasErrors()) {
         let webpackErrors = stats.toJson().errors
         console.log(`here`, webpackErrors[0])
diff --git a/packages/gatsby/src/utils/webpack.config.js b/packages/gatsby/src/utils/webpack.config.js
index 89c4cbd64d7bd..fbc38836918f3 100644
--- a/packages/gatsby/src/utils/webpack.config.js
+++ b/packages/gatsby/src/utils/webpack.config.js
@@ -87,6 +87,25 @@ module.exports = async (
     return hmrBasePath + hmrSuffix
   }
 
+  function getOutputPaths() {
+    const path = program.groupFiles
+      ? directoryPath(`public/scripts`)
+      : directoryPath(`public`)
+
+    let publicPath = program.prefixPaths
+      ? `${store.getState().config.pathPrefix}/`
+      : `/`
+
+    if (program.groupFiles) {
+      publicPath = `${publicPath}scripts/`
+    }
+
+    return {
+      path,
+      publicPath,
+    }
+  }
+
   debug(`Loading webpack config for stage "${stage}"`)
   function getOutput() {
     switch (stage) {
@@ -115,19 +134,15 @@ module.exports = async (
           library: `lib`,
           umdNamedDefine: true,
           globalObject: `this`,
-          path: directoryPath(`public/scripts`),
-          publicPath: program.prefixPaths
-            ? `/scripts${store.getState().config.pathPrefix}/`
-            : `/scripts/`,
+          path: getOutputPaths().path,
+          publicPath: getOutputPaths().publicPath,
         }
       case `build-javascript`:
         return {
           filename: `[name]-[chunkhash].js`,
           chunkFilename: `[name]-[chunkhash].js`,
-          path: directoryPath(`public/scripts`),
-          publicPath: program.prefixPaths
-            ? `/scripts${store.getState().config.pathPrefix}/`
-            : `/scripts/`,
+          path: getOutputPaths().path,
+          publicPath: getOutputPaths().publicPath,
         }
       default:
         throw new Error(`The state requested ${stage} doesn't exist.`)
@@ -168,12 +183,14 @@ module.exports = async (
       plugins.moment(),
 
       // Add a few global variables. Set NODE_ENV to production (enables
-      // optimizations for React) and what the link prefix is (__PATH_PREFIX__).
+      // optimizations for React), what the link prefix is (__PATH_PREFIX__),
+      // and __GROUP_FILES__ to organize output files.
       plugins.define({
         "process.env": processEnv(stage, `development`),
         __PATH_PREFIX__: JSON.stringify(
           program.prefixPaths ? store.getState().config.pathPrefix : ``
         ),
+        __GROUP_FILES__: !!program.groupFiles,
       }),
     ]
 

From 695cb68fca4e0c5ecc9fe9d21c9c61432c3e3403 Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Wed, 4 Jul 2018 11:50:04 -0700
Subject: [PATCH 08/15] Removing the deletion of files as referenced by
 m-allanson and pieh

---
 packages/gatsby/src/bootstrap/index.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/packages/gatsby/src/bootstrap/index.js b/packages/gatsby/src/bootstrap/index.js
index d1af5ef033181..7290251e904cd 100644
--- a/packages/gatsby/src/bootstrap/index.js
+++ b/packages/gatsby/src/bootstrap/index.js
@@ -93,8 +93,6 @@ module.exports = async (args: BootstrapArgs) => {
   await del([
     `public/*.{html,css}`,
     `public/**/*.{html,css}`,
-    `public/scripts`,
-    `public/styles`,
     `!public/static`,
     `!public/static/**/*.{html,css}`,
   ])

From 699e5ca0f88c2037447e4240d0be4467c62e6100 Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Wed, 4 Jul 2018 16:33:36 -0700
Subject: [PATCH 09/15] Adding support for styles grouping

---
 packages/gatsby/cache-dir/static-entry.js  |  9 +++++++--
 packages/gatsby/src/utils/webpack-utils.js | 11 +++++++----
 2 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index 7df6e4577c6ba..9b060446225c4 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -249,9 +249,14 @@ export default (pagePath, callback) => {
     .slice(0)
     .reverse()
     .forEach(style => {
+      // Cleaning up style path for grouping option
+      let dataHrefStyleName = style.name
+      if (style.name.substr(0, 3) === `../`) {
+        dataHrefStyleName = style.name.slice(2)
+      }
+
       // Add <link>s for styles that should be prefetched
       // otherwise, inline as a <style> tag
-
       if (style.rel === `prefetch`) {
         headComponents.push(
           <link
@@ -265,7 +270,7 @@ export default (pagePath, callback) => {
         headComponents.unshift(
           <style
             type="text/css"
-            data-href={urlJoin(pathPrefix, style.name)}
+            data-href={urlJoin(pathPrefix, dataHrefStyleName)}
             dangerouslySetInnerHTML={{
               __html: fs.readFileSync(
                 join(process.cwd(), `public`, pathToGroupStyles, style.name),
diff --git a/packages/gatsby/src/utils/webpack-utils.js b/packages/gatsby/src/utils/webpack-utils.js
index f8685d93013e9..8c55f4de2fd05 100644
--- a/packages/gatsby/src/utils/webpack-utils.js
+++ b/packages/gatsby/src/utils/webpack-utils.js
@@ -428,12 +428,15 @@ module.exports = async ({
    * Extracts css requires into a single file;
    * includes some reasonable defaults
    */
-  plugins.extractText = options =>
-    new MiniCssExtractPlugin({
-      filename: `[name].[contenthash].css`,
-      chunkFilename: `[name].[contenthash].css`,
+  plugins.extractText = options => {
+    const pathToGroupStyles = program.groupFiles ? `../styles/` : ``
+
+    return new MiniCssExtractPlugin({
+      filename: `${pathToGroupStyles}[name].[contenthash].css`,
+      chunkFilename: `${pathToGroupStyles}[name].[contenthash].css`,
       ...options,
     })
+  }
 
   plugins.moment = () => plugins.ignore(/^\.\/locale$/, /moment$/)
 

From eed66167dbd1fe5b5253bdc275709dd14b133ab1 Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Fri, 6 Jul 2018 10:19:57 -0700
Subject: [PATCH 10/15] renaming output directories to js and css

---
 packages/gatsby/cache-dir/static-entry.js    | 4 ++--
 packages/gatsby/src/commands/build-html.js   | 2 +-
 packages/gatsby/src/commands/develop-html.js | 2 +-
 packages/gatsby/src/utils/webpack-utils.js   | 2 +-
 packages/gatsby/src/utils/webpack.config.js  | 4 ++--
 5 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index 9b060446225c4..0a1362f05298f 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -57,8 +57,8 @@ export default (pagePath, callback) => {
 
   // If enabled, group files in their respective folders otherwise generated
   // non-static files will be left in the root of the output directory.
-  const pathToGroupStyles = __GROUP_FILES__ ? `styles/` : ``
-  const pathToGroupScripts = __GROUP_FILES__ ? `scripts/` : ``
+  const pathToGroupStyles = __GROUP_FILES__ ? `css/` : ``
+  const pathToGroupScripts = __GROUP_FILES__ ? `js/` : ``
 
   let bodyHtml = ``
   let headComponents = []
diff --git a/packages/gatsby/src/commands/build-html.js b/packages/gatsby/src/commands/build-html.js
index c6a3878cf95eb..d2c3e4c182861 100644
--- a/packages/gatsby/src/commands/build-html.js
+++ b/packages/gatsby/src/commands/build-html.js
@@ -30,7 +30,7 @@ module.exports = async (program: any) => {
       }
 
       const outputFile = groupFiles
-        ? `${directory}/public/scripts/render-page.js`
+        ? `${directory}/public/js/render-page.js`
         : `${directory}/public/render-page.js`
 
       if (stats.hasErrors()) {
diff --git a/packages/gatsby/src/commands/develop-html.js b/packages/gatsby/src/commands/develop-html.js
index 3ff8d17e84f13..e22a7724cccae 100644
--- a/packages/gatsby/src/commands/develop-html.js
+++ b/packages/gatsby/src/commands/develop-html.js
@@ -26,7 +26,7 @@ module.exports = async (program: any) => {
       }
 
       const outputFile = groupFiles
-        ? `${directory}/public/scripts/render-page.js`
+        ? `${directory}/public/js/render-page.js`
         : `${directory}/public/render-page.js`
 
       if (stats.hasErrors()) {
diff --git a/packages/gatsby/src/utils/webpack-utils.js b/packages/gatsby/src/utils/webpack-utils.js
index 8c55f4de2fd05..7b0e59f72808f 100644
--- a/packages/gatsby/src/utils/webpack-utils.js
+++ b/packages/gatsby/src/utils/webpack-utils.js
@@ -429,7 +429,7 @@ module.exports = async ({
    * includes some reasonable defaults
    */
   plugins.extractText = options => {
-    const pathToGroupStyles = program.groupFiles ? `../styles/` : ``
+    const pathToGroupStyles = program.groupFiles ? `../css/` : ``
 
     return new MiniCssExtractPlugin({
       filename: `${pathToGroupStyles}[name].[contenthash].css`,
diff --git a/packages/gatsby/src/utils/webpack.config.js b/packages/gatsby/src/utils/webpack.config.js
index fbc38836918f3..34a7624b2ac20 100644
--- a/packages/gatsby/src/utils/webpack.config.js
+++ b/packages/gatsby/src/utils/webpack.config.js
@@ -89,7 +89,7 @@ module.exports = async (
 
   function getOutputPaths() {
     const path = program.groupFiles
-      ? directoryPath(`public/scripts`)
+      ? directoryPath(`public/js`)
       : directoryPath(`public`)
 
     let publicPath = program.prefixPaths
@@ -97,7 +97,7 @@ module.exports = async (
       : `/`
 
     if (program.groupFiles) {
-      publicPath = `${publicPath}scripts/`
+      publicPath = `${publicPath}js/`
     }
 
     return {

From 87f0adaafe5271c4a5f6547eb86615102af4edba Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Sun, 8 Jul 2018 15:42:36 -0700
Subject: [PATCH 11/15] Removing config flag

---
 packages/gatsby/cache-dir/.eslintrc.json     |  1 -
 packages/gatsby/cache-dir/static-entry.js    |  7 ++-----
 packages/gatsby/src/commands/build-html.js   |  6 ++----
 packages/gatsby/src/commands/develop-html.js |  6 ++----
 packages/gatsby/src/utils/webpack-utils.js   | 11 ++++-------
 packages/gatsby/src/utils/webpack.config.js  | 16 ++++------------
 6 files changed, 14 insertions(+), 33 deletions(-)

diff --git a/packages/gatsby/cache-dir/.eslintrc.json b/packages/gatsby/cache-dir/.eslintrc.json
index 97ef499c07ae7..7396d0ec0c261 100644
--- a/packages/gatsby/cache-dir/.eslintrc.json
+++ b/packages/gatsby/cache-dir/.eslintrc.json
@@ -4,7 +4,6 @@
   },
   "globals": {
     "__PATH_PREFIX__": false,
-    "__GROUP_FILES__": false,
     "___emitter": false
   }
 }
diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index 0a1362f05298f..63bc333d9f676 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -54,11 +54,8 @@ const createElement = React.createElement
 
 export default (pagePath, callback) => {
   const pathPrefix = `${__PATH_PREFIX__}/`
-
-  // If enabled, group files in their respective folders otherwise generated
-  // non-static files will be left in the root of the output directory.
-  const pathToGroupStyles = __GROUP_FILES__ ? `css/` : ``
-  const pathToGroupScripts = __GROUP_FILES__ ? `js/` : ``
+  const pathToGroupStyles = `css/`
+  const pathToGroupScripts = `js/`
 
   let bodyHtml = ``
   let headComponents = []
diff --git a/packages/gatsby/src/commands/build-html.js b/packages/gatsby/src/commands/build-html.js
index d2c3e4c182861..ec83662528a4d 100644
--- a/packages/gatsby/src/commands/build-html.js
+++ b/packages/gatsby/src/commands/build-html.js
@@ -9,7 +9,7 @@ const { createErrorFromString } = require(`gatsby-cli/lib/reporter/errors`)
 const renderHTML = require(`../utils/html-renderer`)
 
 module.exports = async (program: any) => {
-  const { directory, groupFiles } = program
+  const { directory } = program
 
   debug(`generating static HTML`)
   // Reduce pages objects to an array of paths.
@@ -29,9 +29,7 @@ module.exports = async (program: any) => {
         return reject(e)
       }
 
-      const outputFile = groupFiles
-        ? `${directory}/public/js/render-page.js`
-        : `${directory}/public/render-page.js`
+      const outputFile = `${directory}/public/js/render-page.js`
 
       if (stats.hasErrors()) {
         let webpackErrors = stats.toJson().errors.filter(Boolean)
diff --git a/packages/gatsby/src/commands/develop-html.js b/packages/gatsby/src/commands/develop-html.js
index e22a7724cccae..4261b78415d69 100644
--- a/packages/gatsby/src/commands/develop-html.js
+++ b/packages/gatsby/src/commands/develop-html.js
@@ -7,7 +7,7 @@ const webpackConfig = require(`../utils/webpack.config`)
 const renderHTML = require(`../utils/html-renderer`)
 
 module.exports = async (program: any) => {
-  const { directory, groupFiles } = program
+  const { directory } = program
 
   debug(`generating static HTML`)
 
@@ -25,9 +25,7 @@ module.exports = async (program: any) => {
         return reject(e)
       }
 
-      const outputFile = groupFiles
-        ? `${directory}/public/js/render-page.js`
-        : `${directory}/public/render-page.js`
+      const outputFile = `${directory}/public/js/render-page.js`
 
       if (stats.hasErrors()) {
         let webpackErrors = stats.toJson().errors
diff --git a/packages/gatsby/src/utils/webpack-utils.js b/packages/gatsby/src/utils/webpack-utils.js
index 7b0e59f72808f..87eff2060bcd2 100644
--- a/packages/gatsby/src/utils/webpack-utils.js
+++ b/packages/gatsby/src/utils/webpack-utils.js
@@ -428,15 +428,12 @@ module.exports = async ({
    * Extracts css requires into a single file;
    * includes some reasonable defaults
    */
-  plugins.extractText = options => {
-    const pathToGroupStyles = program.groupFiles ? `../css/` : ``
-
-    return new MiniCssExtractPlugin({
-      filename: `${pathToGroupStyles}[name].[contenthash].css`,
-      chunkFilename: `${pathToGroupStyles}[name].[contenthash].css`,
+  plugins.extractText = options =>
+    new MiniCssExtractPlugin({
+      filename: `../css/[name].[contenthash].css`,
+      chunkFilename: `../css/[name].[contenthash].css`,
       ...options,
     })
-  }
 
   plugins.moment = () => plugins.ignore(/^\.\/locale$/, /moment$/)
 
diff --git a/packages/gatsby/src/utils/webpack.config.js b/packages/gatsby/src/utils/webpack.config.js
index 34a7624b2ac20..e388c56075681 100644
--- a/packages/gatsby/src/utils/webpack.config.js
+++ b/packages/gatsby/src/utils/webpack.config.js
@@ -88,17 +88,11 @@ module.exports = async (
   }
 
   function getOutputPaths() {
-    const path = program.groupFiles
-      ? directoryPath(`public/js`)
-      : directoryPath(`public`)
+    const path = directoryPath(`public/js`)
 
     let publicPath = program.prefixPaths
-      ? `${store.getState().config.pathPrefix}/`
-      : `/`
-
-    if (program.groupFiles) {
-      publicPath = `${publicPath}js/`
-    }
+      ? `${store.getState().config.pathPrefix}/js/`
+      : `/js/`
 
     return {
       path,
@@ -183,14 +177,12 @@ module.exports = async (
       plugins.moment(),
 
       // Add a few global variables. Set NODE_ENV to production (enables
-      // optimizations for React), what the link prefix is (__PATH_PREFIX__),
-      // and __GROUP_FILES__ to organize output files.
+      // optimizations for React) and what the link prefix is (__PATH_PREFIX__).
       plugins.define({
         "process.env": processEnv(stage, `development`),
         __PATH_PREFIX__: JSON.stringify(
           program.prefixPaths ? store.getState().config.pathPrefix : ``
         ),
-        __GROUP_FILES__: !!program.groupFiles,
       }),
     ]
 

From cd834ab12d596f335b63553e4a1de19832380d16 Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Sun, 8 Jul 2018 15:48:38 -0700
Subject: [PATCH 12/15] Removing config flag logic from styles

---
 packages/gatsby-cli/src/create-cli.js     | 16 +++++-----------
 packages/gatsby/cache-dir/static-entry.js |  8 +-------
 2 files changed, 6 insertions(+), 18 deletions(-)

diff --git a/packages/gatsby-cli/src/create-cli.js b/packages/gatsby-cli/src/create-cli.js
index 615e87b4f5357..b00f613eb0e21 100644
--- a/packages/gatsby-cli/src/create-cli.js
+++ b/packages/gatsby-cli/src/create-cli.js
@@ -137,17 +137,11 @@ function buildLocalCommands(cli, isLocalSite) {
         type: `boolean`,
         default: false,
         describe: `Build site with link paths prefixed (set prefix in your config).`,
-      })
-        .option(`no-uglify`, {
-          type: `boolean`,
-          default: false,
-          describe: `Build site without uglifying JS bundles (for debugging).`,
-        })
-        .option(`group-files`, {
-          type: `boolean`,
-          default: false,
-          describe: `Build site with grouping of files in subdirectories.`,
-        }),
+      }).option(`no-uglify`, {
+        type: `boolean`,
+        default: false,
+        describe: `Build site without uglifying JS bundles (for debugging).`,
+      }),
     handler: handlerP(
       getCommandHandler(`build`, (args, cmd) => {
         process.env.NODE_ENV = `production`
diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index 63bc333d9f676..e775f3f59777d 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -246,12 +246,6 @@ export default (pagePath, callback) => {
     .slice(0)
     .reverse()
     .forEach(style => {
-      // Cleaning up style path for grouping option
-      let dataHrefStyleName = style.name
-      if (style.name.substr(0, 3) === `../`) {
-        dataHrefStyleName = style.name.slice(2)
-      }
-
       // Add <link>s for styles that should be prefetched
       // otherwise, inline as a <style> tag
       if (style.rel === `prefetch`) {
@@ -267,7 +261,7 @@ export default (pagePath, callback) => {
         headComponents.unshift(
           <style
             type="text/css"
-            data-href={urlJoin(pathPrefix, dataHrefStyleName)}
+            data-href={urlJoin(pathPrefix, style.name.slice(2))}
             dangerouslySetInnerHTML={{
               __html: fs.readFileSync(
                 join(process.cwd(), `public`, pathToGroupStyles, style.name),

From 41f80b6de082103976d41449a445ef207876a7d3 Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Thu, 12 Jul 2018 08:05:51 -0700
Subject: [PATCH 13/15] Removing 'text/css' from CSS Link

---
 packages/gatsby/cache-dir/static-entry.js  | 1 -
 packages/gatsby/src/utils/webpack-utils.js | 4 ++--
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js
index e775f3f59777d..47035e65af89c 100644
--- a/packages/gatsby/cache-dir/static-entry.js
+++ b/packages/gatsby/cache-dir/static-entry.js
@@ -260,7 +260,6 @@ export default (pagePath, callback) => {
       } else {
         headComponents.unshift(
           <style
-            type="text/css"
             data-href={urlJoin(pathPrefix, style.name.slice(2))}
             dangerouslySetInnerHTML={{
               __html: fs.readFileSync(
diff --git a/packages/gatsby/src/utils/webpack-utils.js b/packages/gatsby/src/utils/webpack-utils.js
index 87eff2060bcd2..f8685d93013e9 100644
--- a/packages/gatsby/src/utils/webpack-utils.js
+++ b/packages/gatsby/src/utils/webpack-utils.js
@@ -430,8 +430,8 @@ module.exports = async ({
    */
   plugins.extractText = options =>
     new MiniCssExtractPlugin({
-      filename: `../css/[name].[contenthash].css`,
-      chunkFilename: `../css/[name].[contenthash].css`,
+      filename: `[name].[contenthash].css`,
+      chunkFilename: `[name].[contenthash].css`,
       ...options,
     })
 

From 6f1e98778b5ab065722d268ab14bf4d2438dfc87 Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Thu, 12 Jul 2018 08:07:31 -0700
Subject: [PATCH 14/15] Woops, adding back the CSS as I was testing locally and
 commited the changes by mistkae

---
 packages/gatsby/src/utils/webpack-utils.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/gatsby/src/utils/webpack-utils.js b/packages/gatsby/src/utils/webpack-utils.js
index 1bbbfd23499a0..09a02f9e9f0b8 100644
--- a/packages/gatsby/src/utils/webpack-utils.js
+++ b/packages/gatsby/src/utils/webpack-utils.js
@@ -435,8 +435,8 @@ module.exports = async ({
    */
   plugins.extractText = options =>
     new MiniCssExtractPlugin({
-      filename: `[name].[contenthash].css`,
-      chunkFilename: `[name].[contenthash].css`,
+      filename: `../css/[name].[contenthash].css`,
+      chunkFilename: `../css/[name].[contenthash].css`,
       ...options,
     })
 

From f1ad75806b9d224b8d537ecb15c655b4428abf07 Mon Sep 17 00:00:00 2001
From: brotzky <brotzky@gmail.com>
Date: Thu, 12 Jul 2018 18:59:41 -0700
Subject: [PATCH 15/15] Adding '../' to the relative static route similar to
 CSS

---
 packages/gatsby/src/utils/webpack-utils.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/gatsby/src/utils/webpack-utils.js b/packages/gatsby/src/utils/webpack-utils.js
index 09a02f9e9f0b8..97737ede0e505 100644
--- a/packages/gatsby/src/utils/webpack-utils.js
+++ b/packages/gatsby/src/utils/webpack-utils.js
@@ -115,7 +115,13 @@ module.exports = async ({
   stage: Stage,
   program: any,
 }): Promise<WebpackUtilsOptions> => {
-  const assetRelativeRoot = `static/`
+  /**
+   *  the leading `../` for assetRelativeRoot is required to ensure
+   * the static files extracted by webpack are not part of the
+   * "build-javascript" output path of `/js`. The same technique is
+   * used for CSS
+   */
+  const assetRelativeRoot = `../static/`
   const vendorRegex = /(node_modules|bower_components)/
   const supportedBrowsers = program.browserlist