Replace to shakapacker from webpacker

config/webpack/rules/babel.js

@@ -1,21 +0,0 @@
-const { join, resolve } = require('path');
-const { env, settings } = require('../configuration');
-
-module.exports = {
-  test: /\.(js|jsx|mjs)$/,
-  include: [
-    settings.source_path,
-    ...settings.resolved_paths,
-  ].map(p => resolve(p)),
-  exclude: /node_modules/,
-  use: [
-    {
-      loader: 'babel-loader',
-      options: {
-        cacheDirectory: join(settings.cache_path, 'babel-loader'),
-        cacheCompression: env.NODE_ENV === 'production',
-        compact: env.NODE_ENV === 'production',
-      },
-    },
-  ],
-};

config/webpack/rules/css.js

@@ -1,28 +0,0 @@
-const MiniCssExtractPlugin = require('mini-css-extract-plugin');
-
-module.exports = {
-  test: /\.s?css$/i,
-  use: [
-    MiniCssExtractPlugin.loader,
-    {
-      loader: 'css-loader',
-      options: {
-        sourceMap: true,
-        importLoaders: 2,
-      },
-    },
-    {
-      loader: 'postcss-loader',
-      options: {
-        sourceMap: true,
-      },
-    },
-    {
-      loader: 'sass-loader',
-      options: {
-        implementation: require('sass'),
-        sourceMap: true,
-      },
-    },
-  ],
-};

config/webpack/rules/file.js

@@ -1,20 +0,0 @@
-const { join } = require('path');
-const { settings } = require('../configuration');
-
-module.exports = {
-  test: new RegExp(`(${settings.static_assets_extensions.join('|')})$`, 'i'),
-  use: [
-    {
-      loader: 'file-loader',
-      options: {
-        name(file) {
-          if (file.includes(settings.source_path)) {
-            return 'media/[path][name]-[hash].[ext]';
-          }
-          return 'media/[folder]/[name]-[hash:8].[ext]';
-        },
-        context: join(settings.source_path),
-      },
-    },
-  ],
-};

config/webpack/rules/index.js

@@ -1,16 +0,0 @@
-const babel = require('./babel');
-const css = require('./css');
-const file = require('./file');
-const tesseract = require('./tesseract');
-const nodeModules = require('./node_modules');
-
-// Webpack loaders are processed in reverse order
-// https://webpack.js.org/concepts/loaders/#loader-features
-// Lastly, process static files using file loader
-module.exports = {
-  file,
-  tesseract,
-  css,
-  nodeModules,
-  babel,
-};

config/webpack/rules/mark.js

@@ -1,8 +1,4 @@
-if (process.env.NODE_ENV === 'production') {
-  module.exports = {};
-} else {
-  module.exports = {
-    test: /\.js$/,
-    loader: 'mark-loader',
-  };
-}
+module.exports = {
+  test: /\.js$/,
+  loader: 'mark-loader',
+};

config/webpack/rules/node_modules.js

@@ -1,5 +1,5 @@
 const { join } = require('path');
-const { settings, env } = require('../configuration');
+const { config, env } = require('shakapacker');
 
 module.exports = {
   test: /\.(js|mjs)$/,
@@ -16,8 +16,8 @@ module.exports = {
         plugins: [
           'transform-react-remove-prop-types',
         ],
-        cacheDirectory: join(settings.cache_path, 'babel-loader-node-modules'),
-        cacheCompression: env.NODE_ENV === 'production',
+        cacheDirectory: join(config.cache_path, 'babel-loader-node-modules'),
+        cacheCompression: env.isProduction,
         compact: false,
         sourceMaps: false,
       },

config/webpack/rules/tesseract.js

@@ -1,14 +1,12 @@
 module.exports = {
+  generator: {
+    filename: 'ocr/[name]-[hash][ext]',
+  },
   test: [
     /tesseract\.js\/dist\/worker\.min\.js$/,
     /tesseract\.js\/dist\/worker\.min\.js.map$/,
     /tesseract\.js-core\/tesseract-core\.wasm$/,
     /tesseract\.js-core\/tesseract-core\.wasm.js$/,
   ],
-  use: {
-    loader: 'file-loader',
-    options: {
-      name: 'ocr/[name]-[hash].[ext]',
-    },
-  },
+  type: 'asset/resource',
 };