risingdamdev
diff --git a/‎docs/en/configurations/extract-css.md
Copy file name to clipboardExpand all lines: docs/en/configurations/extract-css.md
+37-3Lines changed: 37 additions & 3 deletions b/‎docs/en/configurations/extract-css.md
Copy file name to clipboardExpand all lines: docs/en/configurations/extract-css.md
+37-3Lines changed: 37 additions & 3 deletions
diff --git a/‎docs/en/options.md
Copy file name to clipboardExpand all lines: docs/en/options.md
+61Lines changed: 61 additions & 0 deletions b/‎docs/en/options.md
Copy file name to clipboardExpand all lines: docs/en/options.md
+61Lines changed: 61 additions & 0 deletions
@@ -1,12 +1,46 @@
 # Extracting CSS into a Single File
 
+``` bash
+npm install extract-text-webpack-plugin --save-dev
+```
+
+## The Easy Way
+
+> requires vue-loader@^12.0.0 and webpack@^2.0.0
+
+``` js
+// webpack.config.js
+var ExtractTextPlugin = require("extract-text-webpack-plugin")
+
+module.exports = {
+  // other options...
+  module: {
+    rules: [
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+        options: {
+          extractCSS: true
+        }
+      }
+    ]
+  },
+  plugins: [
+    new ExtractTextPlugin("style.css")
+  ]
+}
+```
+
+The above will automatically handle extraction for `<style>` inside `*.vue` files and works with most pre-processors out of the box.
+
+Note this only extracts `*.vue` files though - CSS imported in JavaScript still needs to be configured separately.
+
+## Manual Configuration
+
 Example config to extract all the processed CSS in all Vue components into a single CSS file:
 
 ### Webpack 2.x
 
-``` bash
-npm install extract-text-webpack-plugin --save-dev
-```
 
 ``` js
 // webpack.config.js
 
@@ -185,3 +185,64 @@ module.exports = {
     ]
   }
   ```
+
+### extractCSS
+
+> New in 12.0.0
+
+Automatically extracts the CSS using `extract-text-webpack-plugin`. Works for most pre-processors out of the box, and handles minification in production as well.
+
+The value passed in can be `true`, or an instance of the plugin (so that you can use multiple instances of the extract plugin for multiple extracted files).
+
+This should be only used in production so that hot-reload works during development.
+
+Example:
+
+``` js
+// webpack.config.js
+var ExtractTextPlugin = require("extract-text-webpack-plugin")
+
+module.exports = {
+  // other options...
+  module: {
+    rules: [
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+        options: {
+          extractCSS: true
+        }
+      }
+    ]
+  },
+  plugins: [
+    new ExtractTextPlugin("style.css")
+  ]
+}
+```
+
+Or passing in an instance of the plugin:
+
+``` js
+// webpack.config.js
+var ExtractTextPlugin = require("extract-text-webpack-plugin")
+var plugin = new ExtractTextPlugin("style.css")
+
+module.exports = {
+  // other options...
+  module: {
+    rules: [
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+        options: {
+          extractCSS: plugin
+        }
+      }
+    ]
+  },
+  plugins: [
+    plugin
+  ]
+}
+```