upgrade dependencies: react-scripts v5.0.0, monkey-react-scripts v5.0…

….0-0

package.json

@@ -3,14 +3,14 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@babel/plugin-proposal-decorators": "^7.12.1",
-    "monkey-react-scripts": "^0.3.1",
-    "node-sass": "^4.14.1",
-    "react": "^17.0.0",
-    "react-dom": "^17.0.0",
-    "react-scripts": "4.0.0",
-    "rtlcss": "^2.6.1",
-    "webpack-visualizer-plugin": "^0.1.11"
+    "@babel/plugin-proposal-decorators": "^7.17.2",
+    "monkey-react-scripts": "5.0.0-0",
+    "node-sass": "^7.0.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-scripts": "5.0.0",
+    "rtlcss": "^3.5.0",
+    "webpack-visualizer-plugin2": "^1.0.0"
   },
   "scripts": {
     "start": "monkey-react-scripts start",

webpack-helpers/cssPatch.js

@@ -13,12 +13,8 @@ module.exports.cssPatch = function cssPatch(webpackConfig, isDevelopment) {
     cssRules.forEach((cssRule) => {
         const cssLoaders = cssRule.use
         cssLoaders.forEach((loader) => {
-            if (loader.options && loader.options.ident === 'postcss') {
-                const postCssLoader = loader
-                const postCssFunction = postCssLoader.options.plugins
-                postCssLoader.options.plugins = () => {
-                    return [...postCssFunction(), require('rtlcss')]
-                }
+            if (loader.options && loader.options.postcssOptions && loader.options.postcssOptions.ident === 'postcss') {
+                loader.options.postcssOptions.plugins.push('rtlcss')
             }
         });
     });

webpack-helpers/pluginsPatch.js

@@ -1,4 +1,4 @@
-const Visualizer = require('webpack-visualizer-plugin');
+const Visualizer = require('webpack-visualizer-plugin2');
 
 module.exports.pluginsPatch = function pluginsPatch(webpackConfig, isDevelopment) {
     if (!isDevelopment) {