import ExtractTextPlugin from 'extract-text-webpack-plugin'

export default function extractCss(neutrino: any) {
  const { config } = neutrino

  // Prepend extract text loader before style loader.
  prependUse(config.module.rule('style'), (rule: any) =>
    rule.use('extract-css')
      .loader(require.resolve('extract-text-webpack-plugin/loader'))
      .options({
        omit: 1,
        remove: true,
      })
  )

  // Add plugin to save extracted css.
  config.plugin('extract-css')
    .use(ExtractTextPlugin, [{
      filename: '[name].[chunkhash].bundle.css',
    }])
}

// For loaders, the order matters. In this case we want to prepend
// a loader before existing loaders.
const prependUse = (rule: any, cb: any) => {
  const existingUses = rule.uses.entries()
  rule.uses.clear()
  cb(rule)
  rule.uses.merge(existingUses)
}

import ExtractTextPlugin from 'extract-text-webpack-plugin'

export default function extractCss(neutrino: any) {
  const { config } = neutrino
  const styleRule = config.module.rule('style')

  // We prepend the extract loader by clearing the uses and adding them back in order.
  // Clone existing uses.
  const existingUses = styleRule.uses.toConfig()

  styleRule
    // Clear uses
    .uses
      .clear()
      .end()
    // Add extract-css loader first.
    .use('extract-css')
      .loader(require.resolve('extract-text-webpack-plugin/loader'))
      .options({
        omit: 1,
        remove: true,
      })
      .end()
    // Then add existing uses again.
    .merge(existingUses)

  // Add plugin to save extracted css.
  config.plugin('extract-css')
    .use(ExtractTextPlugin, [{
      filename: '[name].[chunkhash].bundle.css',
    }])
}

--- 
+++ 
@@ -2,27 +2,16 @@
 
 export default function extractCss(neutrino: any) {
   const { config } = neutrino
-  const styleRule = config.module.rule('style')
 
-  // We prepend the extract loader by clearing the uses and adding them back in order.
-  // Clone existing uses.
-  const existingUses = styleRule.uses.toConfig()
-
-  styleRule
-    // Clear uses
-    .uses
-      .clear()
-      .end()
-    // Add extract-css loader first.
-    .use('extract-css')
+  // Prepend extract text loader before style loader.
+  prependUse(config.module.rule('style'), (rule: any) =>
+    rule.use('extract-css')
       .loader(require.resolve('extract-text-webpack-plugin/loader'))
       .options({
         omit: 1,
         remove: true,
       })
-      .end()
-    // Then add existing uses again.
-    .merge(existingUses)
+  )
 
   // Add plugin to save extracted css.
   config.plugin('extract-css')
@@ -30,3 +19,12 @@
       filename: '[name].[chunkhash].bundle.css',
     }])
 }
+
+// For loaders, the order matters. In this case we want to prepend
+// a loader before existing loaders.
+const prependUse = (rule: any, cb: any) => {
+  const existingUses = rule.uses.entries()
+  rule.uses.clear()
+  cb(rule)
+  rule.uses.merge(existingUses)
+}
Clean up extract css magic
