webpack: extract css in development mode

2 files changed, 3 insertions, 3 deletions

diff --git a/package.json b/package.json
index d5b1a331..a03c7bab 100644
--- a/package.json
+++ b/package.json
@@ -3,6 +3,7 @@
   "private": true,
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
+    "watch": "webpack --watch --mode development",
     "compile": "webpack --mode production",
     "lint": "eslint src/main/assets",
     "vnext:test": "jest",
diff --git a/webpack.config.js b/webpack.config.js
index 450adeeb..c4e7361f 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -30,7 +30,7 @@ module.exports = (env, argv) => {
                 test: /\.(css)$/,
                 use: [
                     {
-                        loader: dev ? 'style-loader' : MiniCssExtractPlugin.loader,
+                        loader: MiniCssExtractPlugin.loader,
                     },
                     {
                         loader: 'css-loader',
@@ -62,6 +62,7 @@ module.exports = (env, argv) => {
             }]
         },
         plugins: [
+            new MiniCssExtractPlugin({ filename: 'style.css' })
         ],
         resolve: {
             symlinks: false,
@@ -86,8 +87,6 @@ module.exports = (env, argv) => {
                 failOnError: true,
                 fix: false
             }))
-    } else {
-        config.plugins.push(new MiniCssExtractPlugin({ filename: 'style.css' }))
     }
     config.optimization = {
         minimize: !dev,