diff --git a/packages/gatsby/src/utils/webpack.config.js b/packages/gatsby/src/utils/webpack.config.js
index dd7ca1eb5f175..c3cbcb05db7e0 100644
--- a/packages/gatsby/src/utils/webpack.config.js
+++ b/packages/gatsby/src/utils/webpack.config.js
@@ -398,7 +398,8 @@ module.exports = async (
           // See https://github.com/gatsbyjs/gatsby/issues/11072
           styles: {
             name: `styles`,
-            test: /\.css$/,
+            // This should cover all our types of CSS.
+            test: /\.(css|scss|sass|less|styl)$/,
             chunks: `all`,
             enforce: true,
           },