From a6606419dcf50af177ba9670c632eb614dc92c65 Mon Sep 17 00:00:00 2001
From: coderaiser <coderaiser@cloudcmd.io>
Date: Mon, 22 Nov 2021 20:56:07 +0200
Subject: [PATCH] feature(cloudcmd) webpack v5

---
 .webpack/css.js    | 19 ++++++++++++-------
 .webpack/js.js     |  4 +++-
 client/cloudcmd.js |  6 +++++-
 package.json       |  1 +
 4 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/.webpack/css.js b/.webpack/css.js
index 31ab5f93..06c9ac2a 100644
--- a/.webpack/css.js
+++ b/.webpack/css.js
@@ -10,11 +10,12 @@ const {
 const {env} = process;
 const isDev = env.NODE_ENV === 'development';
 
-const ExtractTextPlugin = require('extract-text-webpack-plugin');
+//const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 
-const extractCSS = (a) => new ExtractTextPlugin(`${a}.css`);
-const extractMain = extractCSS('[name]');
+//const extractCSS = (a) => new ExtractTextPlugin(`${a}.css`);
+//const extractMain = extractCSS('[name]');
 
 const cssNames = [
     'nojs',
@@ -25,23 +26,27 @@ const cssNames = [
     ...getCSSList('columns'),
 ];
 
-const cssPlugins = cssNames.map(extractCSS);
+//const cssPlugins = cssNames.map(extractCSS);
 const clean = (a) => a.filter(Boolean);
 
 const plugins = clean([
-    ...cssPlugins,
-    extractMain,
+    new MiniCssExtractPlugin(),
+    //...cssPlugins,
+    //extractMain,
     !isDev && new OptimizeCssAssetsPlugin(),
 ]);
 
 const rules = [{
     test: /\.css$/,
     exclude: /css\/(nojs|view|config|terminal|user-menu|columns.*)\.css/,
+    use: [MiniCssExtractPlugin.loader, "css-loader"],
+   /*
     use: extractMain.extract([
         'css-loader',
     ]),
+    */
 },
-...cssPlugins.map(extract), {
+/*...cssPlugins.map(extract),*/ {
     test: /\.(png|gif|svg|woff|woff2|eot|ttf)$/,
     use: {
         loader: 'url-loader',
diff --git a/.webpack/js.js b/.webpack/js.js
index bfb0af36..c5aeae3b 100644
--- a/.webpack/js.js
+++ b/.webpack/js.js
@@ -9,7 +9,7 @@ const {
 const {EnvironmentPlugin} = require('webpack');
 const WebpackBar = require('webpackbar');
 
-const ServiceWorkerWebpackPlugin = require('serviceworker-webpack-plugin');
+//const ServiceWorkerWebpackPlugin = require('serviceworker-webpack-plugin');
 
 const dir = './client';
 const dirModules = './client/modules';
@@ -51,10 +51,12 @@ const plugins = [
         NODE_ENV,
     }),
     
+    /*
     new ServiceWorkerWebpackPlugin({
         entry: join(__dirname, '..', 'client', 'sw', 'sw.js'),
         excludes: ['*'],
     }),
+    */
     
     new WebpackBar(),
 ];
diff --git a/client/cloudcmd.js b/client/cloudcmd.js
index 854bcf06..ab6095bc 100644
--- a/client/cloudcmd.js
+++ b/client/cloudcmd.js
@@ -10,10 +10,12 @@ const load = require('load.js');
 
 const isDev = process.env.NODE_ENV === 'development';
 
+/*
 const {
     registerSW,
     listenSW,
 } = require('./sw/register');
+*/
 
 // prevent additional loading of emitify
 window.Emitify = require('emitify');
@@ -29,7 +31,7 @@ module.exports = window.CloudCmd = async (config) => {
     
     await register(config);
     
-    require('./listeners');
+    //require('./listeners');
     require('./key');
     require('./sort');
     
@@ -64,10 +66,12 @@ const onUpdateFound = wraptile(async (config) => {
     window.CloudCmd(config);
 });
 
+/*
 async function register(config) {
     const {prefix} = config;
     const sw = await registerSW(prefix);
     
     listenSW(sw, 'updatefound', onUpdateFound(config));
 }
+*/
 
diff --git a/package.json b/package.json
index 29254e0d..c067947f 100644
--- a/package.json
+++ b/package.json
@@ -177,6 +177,7 @@
     "load.js": "^3.0.0",
     "madrun": "^8.6.0",
     "memfs": "^3.0.1",
+    "mini-css-extract-plugin": "^2.4.5",
     "minor": "^1.2.2",
     "mock-require": "^3.0.1",
     "morgan": "^1.6.1",