Project size and minifications

Here’s my webpack.config.js for an elm/elixir project. I kept it pretty simple. I’m also getting a size warning with this, but it seems to test the size, before it get’s optimized.

const path = require('path')

const CopyWebpackPlugin = require('copy-webpack-plugin')

const elmSource = path.join(__dirname, '/elm')

const MiniCssExtractPlugin = require('mini-css-extract-plugin')

const TerserPlugin = require('terser-webpack-plugin')

const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')

module.exports = (env, argv) => ({

  stats: {

    colors: true

  },

  entry: ['./js/app.js'],

  output: {

    filename: 'app.js',

    path: path.resolve(__dirname, '../priv/static/js')

  },

  module: {

    noParse: [/\.elm$/],

    rules: [

      {

        test: /\.scss$/,

        use: [

          MiniCssExtractPlugin.loader,

          'css-loader',

          'sass-loader'

        ]

      },

      {

        test: /\.elm$/,

        exclude: [/elm-stuff/, /node_modules/],

        use: [

          {

            loader: 'elm-webpack-loader',

            options: {

              verbose: argv.mode === 'production' ? false : true,

              debug: argv.mode === 'production' ? false : true,

              optimize: argv.mode === 'production' ? true : false,

              cwd: elmSource

            }

          }

        ]

      }

    ]

  },

  optimization: {

    minimizer: [

      new TerserPlugin({

        cache: true,

        parallel: true,

        sourceMap: false,

        terserOptions: {

          compress: {

            pure_funcs: [

              'F2',

              'F3',

              'F4',

              'F5',

              'F6',

              'F7',

              'F8',

              'F9',

              'A2',

              'A3',

              'A4',

              'A5',

              'A6',

              'A7',

              'A8',

              'A9'

            ],

            pure_getters: true,

            keep_fargs: false,

            unsafe_comps: true,

            unsafe: true,

            passes: 2,

          },

          mangle: true,

        }

      }),

      new OptimizeCSSAssetsPlugin({})

    ]

  },

  plugins: [

    new CopyWebpackPlugin([{ from: 'static/', to: '../' }]),

    new MiniCssExtractPlugin({ filename: '../css/app.css' })

  ],

  resolve: {

    extensions: ['.js', '.elm'],

    modules: ['node_modules']

  }

});

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.