diff --git a/_dev/webpack/webpack.development.js b/_dev/webpack/webpack.development.js
index dfeb4f1c..ed70b2a8 100644
--- a/_dev/webpack/webpack.development.js
+++ b/_dev/webpack/webpack.development.js
@@ -22,7 +22,7 @@ const devServerConfig = (serverAddress, publicPath, port, siteURL, entriesArray)
 
 exports.developmentConfig = ({ port, publicPath, serverAddress, siteURL, entriesArray, devServer }) => merge(
   {
-    devtool: "cheap-source-map",
+    devtool: 'inline-source-map',
   },
   devServer ? devServerConfig(serverAddress, publicPath, port, siteURL, entriesArray) : {},
 );
diff --git a/_dev/webpack/webpack.parts.js b/_dev/webpack/webpack.parts.js
index b6e94b53..588b9e61 100644
--- a/_dev/webpack/webpack.parts.js
+++ b/_dev/webpack/webpack.parts.js
@@ -54,10 +54,16 @@ exports.extractScss = ({mode = 'production'}) => ({
       test: /\.scss$/,
       use: [
         MiniCssExtractPlugin.loader,
-        'css-loader',
+        {
+          loader: 'css-loader',
+          options: {
+            sourceMap: mode === 'development',
+          }
+        },
         {
           loader: 'postcss-loader',
           options: {
+            sourceMap: mode === 'development',
             postcssOptions: {
               config: path.resolve(__dirname, 'postcss.config.js'),
             },
@@ -66,7 +72,11 @@ exports.extractScss = ({mode = 'production'}) => ({
         {
           loader: 'sass-loader',
           options: {
+            sourceMap: mode === 'development',
             implementation: require('sass'),
+            sassOptions: {
+              outputStyle: 'expanded',
+            },
           },
         },
       ]