How to use the @rails/webpacker.environment.splitChunks function in @rails/webpacker

const { environment } = require('@rails/webpacker')
const { VueLoaderPlugin } = require('vue-loader')
const webpack = require('webpack')
const vue = require('./loaders/vue')

// enable SplitChunks
environment.splitChunks()

// FIXME:
// environment.splitChunks((config) => {
//   return Object.assign({}, config, {
//     optimization: {
//       splitChunks: {
//         cacheGroups: {
//           vendor: {
//             test:/node_modules/,
//             name: 'vendor',
//             chunks: 'initial',
//             enforce: true
//           },
//           vendorCommons: {
//             test: /app\/javascript\/commons/,
//             name: 'vendor-commons',

const WebpackAssetsManifest = require('webpack-assets-manifest');
const { environment } = require('@rails/webpacker');
const erb = require('./loaders/erb');

environment.loaders.prepend('erb', erb);
environment.splitChunks();

module.exports = environment;

const { environment } = require("@rails/webpacker");
const path = require("path");

function resolvePath(relPath) {
  return path.resolve(__dirname, "..", "..", relPath);
}

environment.splitChunks();
environment.loaders.delete("nodeModules");
environment.config.merge({
  resolve: {
    alias: {
      __generated__: resolvePath("app/javascripts/__generated__"),
    },
  },
});
module.exports = environment;