Актуализация пакетов, в процессе

.eslintrc

@@ -1,6 +1,7 @@
 {
   "parserOptions": {
-    "parser": "babel-eslint"
+    "parser": "@babel/eslint-parser",
+    "requireConfigFile": false,
   },
   "extends": [
     "eslint:recommended",

build/webpack.base.config.js

@@ -5,6 +5,12 @@ const VueLoaderPlugin = require('vue-loader/lib/plugin');
 const clientDir = path.resolve(__dirname, '../client');
 
 module.exports = {
+    resolve: {
+        fallback: {
+            "url": false,
+            "path": false,
+        } 
+    },    
     entry: [`${clientDir}/main.js`],
     output: {
         publicPath: '/app/',
@@ -25,14 +31,19 @@ module.exports = {
                 test: /\.js$/,
                 loader: 'babel-loader',
                 exclude: /node_modules/,
-                query: {
+                options: {
+                    presets: [['@babel/preset-env', { targets: { esmodules: true } }]],
+                    plugins: [
+                        ['@babel/plugin-proposal-decorators', { legacy: true }]
+                    ]
+                }
+                /*query: {
                     plugins: [
                         'syntax-dynamic-import',
                         'transform-decorators-legacy',
                         'transform-class-properties',
-//                        ["component", { "libraryName": "element-ui", "styleLibraryName": `~${clientDir}/theme` } ]
                     ]
-                }
+                }*/
             },
             {
                 test: /\.gif$/,

build/webpack.dev.config.js

@@ -1,7 +1,7 @@
 const path = require('path');
 const webpack = require('webpack');
 
-const merge = require('webpack-merge');
+const { merge } = require('webpack-merge');
 const baseWpConfig = require('./webpack.base.config');
 
 baseWpConfig.entry.unshift('webpack-hot-middleware/client');
@@ -13,7 +13,7 @@ const clientDir = path.resolve(__dirname, '../client');
 
 module.exports = merge(baseWpConfig, {
     mode: 'development',
-    devtool: "#inline-source-map",
+    devtool: 'inline-source-map',
     output: {
         path: `${publicDir}/app`,
         filename: 'bundle.js'
@@ -38,6 +38,6 @@ module.exports = merge(baseWpConfig, {
             template: `${clientDir}/index.html.template`,
             filename: `${publicDir}/index.html`
         }),
-        new CopyWebpackPlugin([{from: `${clientDir}/assets/*`, to: `${publicDir}/`, flatten: true}])
+        new CopyWebpackPlugin({patterns: [{from: `${clientDir}/assets/*`, to: `${publicDir}/`}]})
     ]
 });

build/webpack.prod.config.js

@@ -1,10 +1,10 @@
 const path = require('path');
 //const webpack = require('webpack');
 
-const merge = require('webpack-merge');
+const { merge } = require('webpack-merge');
 const baseWpConfig = require('./webpack.base.config');
 const TerserPlugin = require('terser-webpack-plugin');
-const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
+const CssMinimizerWebpackPlugin = require('css-minimizer-webpack-plugin');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const CleanWebpackPlugin = require('clean-webpack-plugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
@@ -42,7 +42,7 @@ module.exports = merge(baseWpConfig, {
                     },
                 },
             }),
-            new OptimizeCSSAssetsPlugin()
+            new CssMinimizerWebpackPlugin()
         ]
     },
     plugins: [
@@ -54,7 +54,7 @@ module.exports = merge(baseWpConfig, {
             template: `${clientDir}/index.html.template`,
             filename: `${publicDir}/index.html`
         }),
-        new CopyWebpackPlugin([{from: `${clientDir}/assets/*`, to: `${publicDir}/`, flatten: true}]),
+        new CopyWebpackPlugin([{from: `${clientDir}/assets/*`, to: `${publicDir}/`}]),
         new GenerateSW({
             cacheId: 'liberama',
             swDest: `${publicDir}/service-worker.js`,

package.json

@@ -21,37 +21,34 @@
     "scripts": "server/config/*.js"
   },
   "devDependencies": {
-    "babel-core": "^6.22.1",
-    "babel-eslint": "^10.1.0",
-    "babel-loader": "^7.1.1",
-    "babel-plugin-component": "^1.1.1",
-    "babel-plugin-syntax-dynamic-import": "^6.18.0",
-    "babel-plugin-transform-class-properties": "^6.24.1",
-    "babel-plugin-transform-decorators-legacy": "^1.3.5",
-    "babel-preset-env": "^1.3.2",
-    "clean-webpack-plugin": "^1.0.1",
-    "copy-webpack-plugin": "^5.1.2",
-    "css-loader": "^1.0.0",
-    "eslint": "^5.16.0",
-    "eslint-plugin-html": "^5.0.5",
-    "eslint-plugin-node": "^8.0.0",
-    "eslint-plugin-vue": "^5.2.3",
-    "file-loader": "^3.0.1",
-    "html-webpack-plugin": "^3.2.0",
+    "@babel/core": "^7.15.8",
+    "@babel/eslint-parser": "^7.15.8",
+    "@babel/plugin-proposal-decorators": "^7.15.8",
+    "@babel/preset-env": "^7.15.8",
+    "babel-loader": "^8.2.3",
+    "clean-webpack-plugin": "^4.0.0",
+    "copy-webpack-plugin": "^9.0.1",
+    "css-loader": "^6.4.0",
+    "css-minimizer-webpack-plugin": "^3.1.1",
+    "eslint": "^8.1.0",
+    "eslint-plugin-html": "^6.2.0",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-vue": "^7.20.0",
+    "file-loader": "^6.2.0",
+    "html-webpack-plugin": "^5.5.0",
     "mini-css-extract-plugin": "^2.4.3",
-    "optimize-css-assets-webpack-plugin": "^5.0.8",
-    "terser-webpack-plugin": "^1.4.5",
-    "url-loader": "^1.1.2",
+    "terser-webpack-plugin": "^5.2.4",
+    "url-loader": "^4.1.1",
     "vue-class-component": "^6.3.2",
     "vue-loader": "^15.9.8",
     "vue-style-loader": "^4.1.3",
     "vue-template-compiler": "^2.6.14",
-    "webpack": "^4.46.0",
-    "webpack-cli": "^3.3.12",
-    "webpack-dev-middleware": "^3.7.3",
+    "webpack": "^5.60.0",
+    "webpack-cli": "^4.9.1",
+    "webpack-dev-middleware": "^5.2.1",
     "webpack-hot-middleware": "^2.25.1",
-    "webpack-merge": "^4.2.2",
-    "workbox-webpack-plugin": "^5.1.4"
+    "webpack-merge": "^5.8.0",
+    "workbox-webpack-plugin": "^6.3.0"
   },
   "dependencies": {
     "@quasar/extras": "^1.11.2",

server/core/WebSocketConnection.js

@@ -9,7 +9,8 @@ const cleanPeriod = 5*1000;//5 секунд
 class WebSocketConnection {
     //messageLifeTime в секундах (проверка каждый cleanPeriod интервал)
     constructor(url, openTimeoutSecs = 10, messageLifeTimeSecs = 30) {
-        this.WebSocket = (isBrowser ? WebSocket : require('ws'));
+        const ws = 'ws';
+        this.WebSocket = (isBrowser ? WebSocket : require(ws));
         this.url = url;
         this.ws = null;
         this.listeners = [];