Add Debugging With Full Source Maps as a webpack til

README.md

@@ -7,7 +7,7 @@ variety of languages and technologies. These are things that don't really
 warrant a full blog post. These are mostly things I learn by pairing with
 smart people at [Hashrocket](http://hashrocket.com/).
 
-_372 TILs and counting..._
+_373 TILs and counting..._
 
 ---
 
@@ -449,6 +449,7 @@ _372 TILs and counting..._
 
 ## Webpack
 
+- [Debugging With Full Source Maps](webpack/debugging-with-full-source-maps.md)
 - [Run ESLint As A Preloader](webpack/run-eslint-as-a-preloader.md)
 - [Use A Specific Config File](webpack/use-a-specific-config-file.md)
 

webpack/debugging-with-full-source-maps.md

@@ -0,0 +1,16 @@
+# Debugging With Full Source Maps
+
+After Webpack runs your JavaScript through various loaders, it no longer
+looks like the code you were writing in your editor. This can make debugging
+difficult when you inspect the source of an error in the browser's devtools.
+Fortunately, Webpack makes it easy to enhance debugging with full source
+maps of your code. Just add the following option to your Webpack config:
+
+```javascript
+devtool: source-map
+```
+
+This will generate a full source map with a filename that is something like
+`bundle.js.map`.
+
+Note: this will slow down the webpack build process a bit.