fix netlify-cms and sass plugin css extraction

Author: erquhart

packages/gatsby-plugin-netlify-cms/src/gatsby-node.js

@@ -1,5 +1,6 @@
 const HtmlWebpackPlugin = require(`html-webpack-plugin`)
 const ExtractTextPlugin = require(`extract-text-webpack-plugin`)
+const extractCmsCss = new ExtractTextPlugin(`cms.css`)
 
 function plugins(stage) {
   const commonPlugins = [
@@ -15,7 +16,7 @@ function plugins(stage) {
     case `develop`:
       return commonPlugins
     case `build-javascript`:
-      return [...commonPlugins, new ExtractTextPlugin(`cms.css`)]
+      return [...commonPlugins, extractCmsCss]
     default:
       return []
   }
@@ -52,7 +53,7 @@ function module(config, stage) {
       config.loader(`cms-css`, {
         test: /\.css$/,
         include: [/\/node_modules\/netlify-cms\//],
-        loader: ExtractTextPlugin.extract([`css`]),
+        loader: extractCmsCss.extract([`css`]),
       })
       return config
     default:

packages/gatsby-plugin-sass/src/gatsby-node.js

@@ -1,6 +1,8 @@
 const ExtractTextPlugin = require(`extract-text-webpack-plugin`)
 const { cssModulesConfig } = require(`gatsby-1-config-css-modules`)
 
+const extractSass = new ExtractTextPlugin(`styles.css`, { allChunks: true })
+
 exports.modifyWebpackConfig = ({ config, stage }, options) => {
   const sassFiles = /\.s[ac]ss$/
   const sassModulesFiles = /\.module\.s[ac]ss$/
@@ -24,16 +26,21 @@ exports.modifyWebpackConfig = ({ config, stage }, options) => {
       config.loader(`sass`, {
         test: sassFiles,
         exclude: sassModulesFiles,
-        loader: ExtractTextPlugin.extract([`css?minimize`, sassLoader]),
+        loader: extractSass.extract([`css?minimize`, sassLoader]),
       })
 
       config.loader(`sassModules`, {
         test: sassModulesFiles,
-        loader: ExtractTextPlugin.extract(`style`, [
+        loader: extractSass.extract(`style`, [
           cssModulesConfig(stage),
           sassLoader,
         ]),
       })
+
+      config.merge({
+        plugins: [extractSass],
+      })
+
       return config
     }
     case `develop-html`:
@@ -47,11 +54,16 @@ exports.modifyWebpackConfig = ({ config, stage }, options) => {
 
       config.loader(`sassModules`, {
         test: sassModulesFiles,
-        loader: ExtractTextPlugin.extract(`style`, [
+        loader: extractSass.extract(`style`, [
           cssModulesConfig(stage),
           sassLoader,
         ]),
       })
+
+      config.merge({
+        plugins: [extractSass],
+      })
+
       return config
     }
     default: {