MENU


Assets Bundling & Code Minification

For the most efficient Brunch production build, install the terser-brunch plugin:

npm install --save-dev terser-brunchbrunch build -p

For the most efficient Browserify production build, install a few plugins:


RESETRUNFULL
npm install --save-dev envify terser uglifyifybrowserify ./index.js \
              -g [ envify --NODE_ENV production ] \
              -g uglifyify \
             | terser --compress --mangle > ./bundle.js

'envify' ensures the right build environment is set.

'uglifyify' removes development imports.

'terser' compresses the code.

For the most efficient Rollup production build, install a few plugins:

npm install --save-dev rollup-plugin-commonjs rollup-plugin-replace rollup-plugin-terser
plugins: [ // ... require('rollup-plugin-replace')({ 'process.env.NODE_ENV': JSON.stringify('production') }), require('rollup-plugin-commonjs')(), require('rollup-plugin-terser')(), // ...]

'commonjs' provides support for CommonJS in Rollup.

'replace' ensures the right build environment is set.

'terser' compresses and mangles the final bundle.

Webpack v4+ (used by Create-React-App internally) will minify your code by default in production mode.


RESETRUNFULL
const TerserPlugin = require('terser-webpack-plugin');module.exports = {
  mode: 'production',
  optimization: {
    minimizer: [new TerserPlugin({ /* additional options here */ })],
  },};