started on mini-css-extract-plugin but causes tests not to run... :/

devlinjunker · May 1, 2020 · 05e24c5 · 05e24c5
1 parent ca979d1
commit 05e24c5
Show file tree

Hide file tree

Showing 5 changed files with 112 additions and 2 deletions.
diff --git a/karma.conf.js b/karma.conf.js
@@ -9,6 +9,8 @@ const env = {
 const webpack = buildWebpack(env);
 webpack.watch = true;
 
+console.log('TEST');
+
 const karmaConfig = function(config) {
   config.set({
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -79,6 +79,7 @@
     "karma-webpack": "^3.0.5",
     "list-selectors": "^2.0.0",
     "madge": "^3.8.0",
+    "mini-css-extract-plugin": "^0.9.0",
     "mocha": "^6.2.3",
     "postcss-exclude-files": "^1.0.15",
     "postcss-loader": "^3.0.0",

diff --git a/test/test.bootstrap.js b/test/test.bootstrap.js
@@ -7,9 +7,15 @@ chai.use(sinonChai);
 global.expect = chai.expect;
 global.sandbox = sinon.createSandbox();
 
+console.log('TEST');
+
 // $FlowFixMe
 const testsContext = require.context('../src', true, /.spec$/);
 
+console.log('TEST');
+console.log(testsContext);
+console.log('\n\n\n TESTING');
+
 testsContext.keys().forEach(testsContext);
 
 /* eslint-disable mocha/no-top-level-hooks,mocha/no-hooks-for-single-case */

diff --git a/webpack.config.js b/webpack.config.js
@@ -5,6 +5,7 @@ const HtmlWebpackPlugin = require('html-webpack-plugin');
 const FlowWebpackPlugin = require('flow-webpack-plugin');
 const CircularDependencyPlugin = require('circular-dependency-plugin');
 const WriteFilePlugin = require('write-file-webpack-plugin');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 
 const webpack = require('webpack');
 const WebpackDevServer = require('webpack-dev-server');
@@ -61,6 +62,8 @@ module.exports = (env) => {
         chunks: ['storage']
       }),
 
+      new MiniCssExtractPlugin(),
+
       // Run Flow on Webpack Compile
       new FlowWebpackPlugin({
         failOnError: false,
@@ -115,8 +118,11 @@ module.exports = (env) => {
         {
           test: /\.css$/,
           use: [
+            // {
+            //   loader: 'style-loader',
+            // },
             {
-              loader: 'style-loader',
+              loader: MiniCssExtractPlugin.loader
             },
             {
               loader: 'css-loader',
@@ -126,7 +132,7 @@ module.exports = (env) => {
             },
             {
               loader: 'postcss-loader'
-            }
+            },
           ]
         },
 
@@ -170,5 +176,7 @@ module.exports = (env) => {
     });
   }
 
+  console.log('TEST1');
+
   return config;
 };