I recently migrated from webpacker to jsbundling-rails with webpack using this file as a reference link, but I have a problem and it is that in the path app/assets/builds/application.js where the compiled assets are saved my application.js has this error Uncaught SyntaxError: Unexpected token 'export' (at application.self-e83fecda2964d84ce99e3e0b0a8c32ec74efe4bdaea54b46ae9252b25272b5dd.js?body = 1:86946:1). I do not understand well what this error is due to, I tried installing babel but it does not work, but if I change the output path to the public/packs/ path the error disappears, any idea what the error could be?

my webpack.config.js:

const path = require('path');
const webpack = require('webpack');

const { VueLoaderPlugin } = require('vue-loader');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const RemoveEmptyScriptsPlugin = require('webpack-remove-empty-scripts');

const mode = process.env.NODE_ENV || 'development';
console.log(`Webpack mode: ${mode}`);
const isProd = mode === 'production';

module.exports = {
  mode,
  devtool: !isProd ? 'source-map' : false,
  optimization: {
    moduleIds: 'deterministic',
  },
  entry: {
    application: './app/javascript/application.js'
  },
  output: {
    filename: isProd ? '[name].[contenthash].js' : '[name].js',
    chunkFilename: isProd ? '[name].[contenthash].js' : '[name].js',
    path: path.resolve(__dirname, 'app/assets/builds'),
    clean: true,
  },
  module: {
    rules: [
      {
        test: /\.vue$/,
        loader: 'vue-loader'
      },
      {
        test: /\.js.erb$/,
        enforce: 'pre',
        exclude: /node_modules/,
        use: [{
          loader: 'rails-erb-loader',
          options: {
            runner: 'bin/rails runner',
          }
        }]
      },
    ],
  },
  resolve: {
    modules: [
      'node_modules',
    ],
    extensions: [
      '.vue',
      '.mjs',
      '.js',
      '.js.erb',
      '.sass',
      '.scss',
      '.css',
      '.module.sass',
      '.module.scss',
      '.module.css',
      '.png',
      '.svg',
      '.gif',
      '.jpeg',
      '.jpg',
    ],
  },
  plugins: [
    new webpack.optimize.LimitChunkCountPlugin({
      maxChunks: 1,
    }),
    new VueLoaderPlugin(),
    new RemoveEmptyScriptsPlugin(),
    new MiniCssExtractPlugin({
      filename: isProd ? '[name].[contenthash].css' : '[name].css',
    }),
    new webpack.ProvidePlugin({
      $: 'jquery',
      jQuery: 'jquery',
      'window.jQuery': 'jquery',
    })
  ]
}