diff --git a/lib/webpack/createBaseConfig.js b/lib/webpack/createBaseConfig.js
index b26788ddac..9b4b57b67a 100644
--- a/lib/webpack/createBaseConfig.js
+++ b/lib/webpack/createBaseConfig.js
@@ -179,7 +179,9 @@ module.exports = function createBaseConfig ({
         if (isProd) {
           rule.use('extract-css-loader').loader(CSSExtractPlugin.loader)
         } else {
-          rule.use('vue-style-loader').loader('vue-style-loader')
+          rule.use('vue-style-loader').loader('vue-style-loader').options({
+            sourceMap: !isProd
+          })
         }
       }
 
@@ -188,12 +190,13 @@ module.exports = function createBaseConfig ({
         .options({
           modules,
           localIdentName: `[local]_[hash:base64:8]`,
-          importLoaders: 1
+          importLoaders: 1,
+          sourceMap: !isProd
         })
 
       rule.use('postcss-loader').loader('postcss-loader').options(Object.assign({
         plugins: [require('autoprefixer')],
-        sourceMap: !isProd
+        sourceMap: !isProd || modules
       }, siteConfig.postcss))
 
       if (loader) {
@@ -203,11 +206,19 @@ module.exports = function createBaseConfig ({
   }
 
   createCSSRule('css', /\.css$/)
-  createCSSRule('scss', /\.scss$/, 'sass-loader', siteConfig.scss)
-  createCSSRule('sass', /\.sass$/, 'sass-loader', Object.assign({ indentedSyntax: true }, siteConfig.sass))
-  createCSSRule('less', /\.less$/, 'less-loader', siteConfig.less)
+  createCSSRule('scss', /\.scss$/, 'sass-loader', Object.assign({
+    sourceMap: !isProd
+  }, siteConfig.scss))
+  createCSSRule('sass', /\.sass$/, 'sass-loader', Object.assign({
+    indentedSyntax: true,
+    sourceMap: !isProd
+  }, siteConfig.sass))
+  createCSSRule('less', /\.less$/, 'less-loader', Object.assign({
+    sourceMap: !isProd
+  }, siteConfig.less))
   createCSSRule('stylus', /\.styl(us)?$/, 'stylus-loader', Object.assign({
-    preferPathResolver: 'webpack'
+    preferPathResolver: 'webpack',
+    sourceMap: !isProd
   }, siteConfig.stylus))
 
   config