feat: Minify with terser (#789)

closes #742

.gitignore

@@ -1,4 +1,5 @@
 node_modules
 *.log
 dist
-.cache
+.cache
+playground

docs/README.md

@@ -409,6 +409,16 @@ You can also minify the output, resulting into lower bundle sizes by using the `
 tsup src/index.ts --minify
 ```
 
+To use [Terser](https://github.com/terser/terser) instead of esbuild for minification, pass terser as argument value
+
+```bash
+tsup src/index.ts --minify terser
+```
+
+> NOTE: You must have terser installed. Install it with `npm install -D terser`
+
+In `tsup.config.js`, you can pass `terserOptions` which will be passed to `terser.minify` as it is.
+
 ### Custom loader
 
 Esbuild loader list:

package.json

@@ -62,6 +62,7 @@
     "rollup-plugin-hashbang": "2.2.2",
     "strip-json-comments": "4.0.0",
     "svelte": "3.46.4",
+    "terser": "^5.16.0",
     "ts-essentials": "9.1.2",
     "tsconfig-paths": "3.12.0",
     "tsup": "6.4.0",

src/cli-main.ts

@@ -20,7 +20,7 @@ export async function main(options: Options = {}) {
     .option('--format <format>', 'Bundle format, "cjs", "iife", "esm"', {
       default: 'cjs',
     })
-    .option('--minify', 'Minify bundle')
+    .option('--minify [terser]', 'Minify bundle')
     .option('--minify-whitespace', 'Minify whitespace')
     .option('--minify-identifiers', 'Minify identifiers')
     .option('--minify-syntax', 'Minify syntax')

src/esbuild/index.ts

@@ -257,7 +257,7 @@ export async function runEsbuild(
       write: false,
       splitting,
       logLevel: 'error',
-      minify: options.minify,
+      minify: options.minify === 'terser' ? false : options.minify,
       minifyWhitespace: options.minifyWhitespace,
       minifyIdentifiers: options.minifyIdentifiers,
       minifySyntax: options.minifySyntax,

src/index.ts

@@ -20,6 +20,7 @@ import { es5 } from './plugins/es5'
 import { sizeReporter } from './plugins/size-reporter'
 import { treeShakingPlugin } from './plugins/tree-shaking'
 import { copyPublicDir, isInPublicDir } from './lib/public-dir'
+import { terserPlugin } from './plugins/terser'
 
 export type { Format, Options, NormalizedOptions }
 
@@ -260,6 +261,11 @@ export async function build(_options: Options) {
                     cjsSplitting(),
                     es5(),
                     sizeReporter(),
+                    terserPlugin({
+                      minifyOptions: options.minify,
+                      format,
+                      terserOptions: options.terserOptions,
+                    }),
                   ])
                   await runEsbuild(options, {
                     pluginContainer,

src/options.ts

@@ -3,6 +3,7 @@ import type { InputOption } from 'rollup'
 import { MarkRequired } from 'ts-essentials'
 import type { Plugin } from './plugin'
 import type { TreeshakingStrategy } from './plugins/tree-shaking'
+import type { MinifyOptions } from 'terser'
 
 export type Format = 'cjs' | 'esm' | 'iife'
 
@@ -65,7 +66,8 @@ export type Options = {
    * default to `node14`
    */
   target?: string | string[]
-  minify?: boolean
+  minify?: boolean | 'terser'
+  terserOptions?: MinifyOptions
   minifyWhitespace?: boolean
   minifyIdentifiers?: boolean
   minifySyntax?: boolean

src/plugins/terser.ts

@@ -0,0 +1,67 @@
+import { MinifyOptions } from 'terser'
+import { PrettyError } from '../errors'
+import { createLogger } from '../log'
+import { Format, Options } from '../options'
+import { Plugin } from '../plugin'
+import { localRequire } from '../utils'
+
+const logger = createLogger()
+
+export const terserPlugin = ({
+  minifyOptions,
+  format,
+  terserOptions = {},
+}: {
+  minifyOptions: Options['minify']
+  format: Format
+  terserOptions?: MinifyOptions
+}): Plugin => {
+  return {
+    name: 'terser',
+
+    async renderChunk(code, info) {
+      if (minifyOptions !== 'terser' || !/\.(cjs|js|mjs)$/.test(info.path))
+        return
+
+      const terser: typeof import('terser') | undefined = localRequire('terser')
+
+      if (!terser) {
+        throw new PrettyError(
+          'terser is required for terser minification. Please install it with `npm install terser -D`'
+        )
+      }
+
+      const { minify } = terser
+
+      const defaultOptions: MinifyOptions = {}
+
+      if (format === 'esm') {
+        defaultOptions.module = true
+      } else {
+        defaultOptions.toplevel = true
+      }
+
+      try {
+        const minifiedOutput = await minify(
+          { [info.path]: code },
+          { ...defaultOptions, ...terserOptions }
+        )
+
+        logger.info('TERSER', 'Minifying with Terser')
+
+        if (!minifiedOutput.code) {
+          logger.error('TERSER', 'Failed to minify with terser')
+        }
+
+        logger.success('TERSER', 'Terser Minification success')
+
+        return { code: minifiedOutput.code!, map: minifiedOutput.map }
+      } catch (e) {
+        logger.error('TERSER', 'Failed to minify with terser')
+        logger.error('TERSER', e)
+      }
+
+      return { code, map: info.map }
+    },
+  }
+}