Skip to main content

Terser

Terser​

Terser 是一个流行的 JavaScript 解析器和压缩器，可以优化 JavaScript 代码以减少其大小，从而提高 web 页面的加载速度。

Terser 是 Uglify-es 的替代品，后者已经停止维护，Terser 支持 ES6 和更高版本的 JavaScript。

主要功能​

  • 删除无用的代码：Terser 可以自动删除代码中的无用代码（也称为 "dead code"），例如未被调用的函数和未被使用的变量。
  • 压缩和混淆代码：Terser 可以将代码压缩到尽可能小的大小。它可以移除空格和注释，将变量和函数名重命名为短的名称，以及使用其他的压缩技术。这也有助于混淆你的代码，使得它更难被人类理解，从而提高代码的安全性。
  • 保留注释：虽然 Terser 默认会移除所有的注释，但可以配置它保留某些注释，例如包含特定关键词的注释。
  • 源码映射支持：Terser 支持生成源码映射（source map），这可以在压缩后的代码中进行调试。
  • 支持 ES6 及更高版本：Terser 支持最新版本的 JavaScript，包括 ES6、ES7、ES8 等。

API​

Terser API 提供了 minify 方法可对代码进行压缩：

const { minify } = require("terser");
const path = require("path");
const fs = require("fs");

const codePath = path.resolve("src", "index.js");
const outDir = "dist";
const outPath = path.resolve(outDir, "index.js");
const outSourcemapPath = path.resolve(outDir, "index.js.map");

const code = {
  "index.js": fs.readFileSync(codePath, "utf8"),
};

const options = {
  sourceMap: {
    filename: "index.js",
    url: "index.js.map",
  },
};

minify(code, options)
  .then((result) => {
    if (!fs.existsSync(outDir)) {
      fs.mkdirSync(outDir, { recursive: true });
    }

    fs.writeFileSync(outPath, result.code);

    if (result.map) {
      fs.writeFileSync(outSourcemapPath, result.map);
    }
  })
  .catch((err) => {
    console.error(err);
  });

minify 方法提供了众多压缩选项：

{
    parse: {
        // parse options
    },
    compress: {
        // compress options
    },
    mangle: {
        // mangle options

        properties: {
            // mangle property options
        }
    },
    format: {
        // format options (can also use `output` for backwards compatibility)
    },
    sourceMap: {
        // source map options
    },
    ecma: 5, // specify one of: 5, 2015, 2016, etc.
    enclose: false, // or specify true, or "args:values"
    keep_classnames: false,
    keep_fnames: false,
    ie8: false,
    module: false,
    nameCache: null, // or specify a name cache object
    safari10: false,
    toplevel: false
}

CLI​

CLI 底层调用的是 API，基本的格式如下：

terser [input files] [options]
  • input files：要压缩的文件。
  • options：压缩配置项。

例如：

"scripts": {
  "compress": "terser ./src/index.js -o ./dist/index.js --source-map -o ./dist/index.js"
}

配置文件​

Terser 这个工具比较小，所以没有支持单独的配置文件。

Last updated on