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

// Remove the digest from the output js filename.
// https://github.com/matestack/matestack-ui-core/issues/343#issuecomment-581149092
//
environment.config.set("output.filename", chunkData => {
  return "[name].js"
})

// Remove the digest from the output css filename.
// https://github.com/matestack/matestack-ui-core/issues/343#issuecomment-581149092
//
// Inspect with:
//
//     console.log(environment.plugins)
//
const miniCssExtractPlugin = environment.plugins.get('MiniCssExtract')
miniCssExtractPlugin.options.filename = "[name].css"

module.exports = environment

const { environment } = require('@rails/webpacker')
const coffee =  require('./loaders/coffee')
const webpack = require('webpack')

// Add an additional plugin of your choosing : ProvidePlugin
environment.plugins.prepend(
  'Provide',
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    jquery: 'jquery',
    'window.Tether': 'tether',
    Popper: ['popper.js', 'default'],
    ActionCable: 'actioncable'
  })
)

environment.loaders.append('coffee', coffee)
// console.log(environment)
module.exports = environment

use: {
    loader: "babel-loader",
    options: {
      cacheCompression: false,
      cacheDirectory: true
    }
  }
})
environment.loaders.prepend("yaml", {
  test: /\.ya?ml$/,
  exclude: /node_modules/,
  use: "js-yaml-loader"
})

// Makes it possible to not import these very used components
environment.plugins.append(
  "ProvidePlugin",
  new webpack.ProvidePlugin({
    Account: ["api-maker/models", "Account"],
    classNames: "classnames",
    Hash: ["shared/hash", "default"],
    I18n: ["shared/i18n", "default"],
    Layout: ["components/layout", "default"],
    Params: ["@kaspernj/api-maker", "Params"],
    Project: ["api-maker/models", "Project"],
    PropTypes: "prop-types",
    PropTypesExact: "prop-types-exact",
    React: "react",
    Routes: ["shared/routes", "default"],
    setStateAsync: ["shared/set-state-async", "default"],
    Task: ["api-maker/models", "Task"],

//           }
//         }
//       }
//     }
//   })
// })

environment.plugins.append('Provide', new webpack.ProvidePlugin({
  $: 'jquery',
  jQuery: 'jquery',
  Popper: ['popper.js', 'default']
}))

environment.plugins.prepend('VueLoaderPlugin', new VueLoaderPlugin())
environment.loaders.prepend('vue', vue)
environment.plugins.append('ContextReplacement',
  new webpack.ContextReplacementPlugin(
    /moment[\/\\]locale$/,
    /ja|en-SG|en-au|en-ca|en-gb|en-ie|en-il|en-nz|de|fr|fu|zh-tw|zh-cn|zh-hk/
  )
)

module.exports = environment

const { environment } =  require('@rails/webpacker');
const typescript      =  require('./loaders/typescript');
const sass            =  require('./loaders/sass');

const webpack = require("webpack");

environment.loaders.prepend('typescript', typescript);

environment.loaders.prepend('sass', sass);

environment.plugins.append("Provide", new webpack.ProvidePlugin({
  $: 'jquery',
 jQuery: 'jquery',
 Popper: ['popper.js', 'default']
}));

module.exports = environment;

const { environment } = require('@rails/webpacker')
const webpack = require('webpack')

environment.plugins.prepend(
  'Provide',
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    jquery: 'jquery',
    'window.jQuery': 'jquery'
  })
)

environment.config.merge({
  module: {
    rules: [{
      test: require.resolve('jquery'),
      use: [{
        loader: 'expose-loader',
        options: 'jQuery'

const { environment } = require('@rails/webpacker')
const webpack = require('webpack')

environment.plugins.append(
  'Provide',
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    Popper: ['popper.js', 'default']
  })
)

module.exports = environment

const { environment } = require('@rails/webpacker')
const webpack = require("webpack")

environment.plugins.append("Provide", new webpack.ProvidePlugin({

$: 'jquery',

jQuery: 'jquery',

Popper: ['popper.js', 'default']

}))


module.exports = environment

const { environment } = require('@rails/webpacker')
const webpack = require('webpack')

module.exports = environment

environment.plugins.prepend(
  'Provide',
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    jquery: 'jquery'
  })
)

const { environment } = require('@rails/webpacker')

const webpack = require('webpack')
environment.plugins.append(
  'Provide',
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    Popper: ['popper.js', 'default']
  })
)

module.exports = environment