Gifsicle 是一個(gè)處理 gif 圖片的工具，在前端開發(fā)中，也經(jīng)常利用它來進(jìn)行 gif 圖片的壓縮工作。由于 Gifsicle 是用c寫的，所以一般還需要使用 gifsicle-bin 來進(jìn)行調(diào)用。

背景

在前端工程中，使用了 imagemin-gifsicle 在提交代碼前對(duì) gif 圖片進(jìn)行壓縮。在本地使用（mac）是正常的，但在 ci 中對(duì)項(xiàng)目進(jìn)行打包時(shí)，報(bào)了以下錯(cuò)誤：

npm ERR! gifsicle@5.1.0 postinstall: `node lib/install.js`

注：亟需解決的可以直接跳過，看最后面的解決方案

原因分析

嘗試使用 docker 在本地復(fù)現(xiàn) ci 環(huán)境進(jìn)行打包，打出了更加詳細(xì)的錯(cuò)誤：

> gifsicle@5.1.0 postinstall /home/jenkins/rttest/node_modules/gifsicle
> node lib/install.js

  ? Response code 404 (Not Found)
  ? gifsicle pre-build test failed
  ? compiling from source
  ? Error: Command failed: /bin/sh -c autoreconf -ivf
/bin/sh: 1: autoreconf: not found

    at Promise.all.then.arr (/home/jenkins/rttest/node_modules/bin-build/node_modules/execa/index.js:231:11)
    at process._tickCallback (internal/process/next_tick.js:68:7)

可以看到，在執(zhí)行 /bin/sh -c autoreconf -ivf 報(bào)錯(cuò)了，原因是沒找到 autoreconf 命令。autoreconf 在ci服務(wù)器上沒有預(yù)裝是能理解的，再看下為什么需要執(zhí)行這條命令。
核心代碼如下：

## gifsicle/lib/install.js
try {
    await bin.run(['--version']);
} catch (error) {
    const config = [
        './configure --disable-gifview --disable-gifdiff',
        `--prefix="${bin.dest()}" --bindir="${bin.dest()}"`
    ].join(' ');

    try {
        await binBuild.file(path.resolve(__dirname, '../vendor/source/gifsicle-1.92.tar.gz'), [
            'autoreconf -ivf',
            config,
            'make install'
        ]);
    } catch (error) {
        process.exit(1);
    }
}

可以看到，程序先執(zhí)行了 bin.run()，執(zhí)行報(bào)錯(cuò)才進(jìn)行下面的邏輯，而下面代碼的主要工作是對(duì) vendor/source/gifsicle-1.92.tar.gz Gifsicle 源碼的編譯，也就是在這一步，報(bào)了找不到 autoreconf 的錯(cuò)誤。

再看看bin.run()做了什么。

## gifsicle/lib/index.js
const path = require('path');
const BinWrapper = require('bin-wrapper');
const pkg = require('../package.json');

const url = `https://raw.githubusercontent.com/imagemin/gifsicle-bin/v${pkg.version}/vendor/`;

module.exports = new BinWrapper()
    .src(`${url}macos/gifsicle`, 'darwin')
    .src(`${url}linux/x86/gifsicle`, 'linux', 'x86')
    .src(`${url}linux/x64/gifsicle`, 'linux', 'x64')
    .src(`${url}freebsd/x86/gifsicle`, 'freebsd', 'x86')
    .src(`${url}freebsd/x64/gifsicle`, 'freebsd', 'x64')
    .src(`${url}win/x86/gifsicle.exe`, 'win32', 'x86')
    .src(`${url}win/x64/gifsicle.exe`, 'win32', 'x64')
    .dest(path.join(__dirname, '../vendor'))
    .use(process.platform === 'win32' ? 'gifsicle.exe' : 'gifsicle');

可以看到，借用了bin-wrapper工具，根據(jù)不同系統(tǒng)去下載對(duì)應(yīng)的二進(jìn)制文件，我所使用的 ci 環(huán)境是 linux x64，gifsicle-bin 版本為 5.1.0，手動(dòng)拼裝一下鏈接進(jìn)行訪問：https://raw.githubusercontent.com/imagemin/gifsicle-bin/v5.1.0/vendor/linux/x64/gifsicle
返回了404，更改版本為4.0.0測試，發(fā)現(xiàn)能夠正常下載到文件：https://raw.githubusercontent.com/imagemin/gifsicle-bin/v4.0.0/vendor/linux/x64/gifsicle。

很明顯，報(bào)錯(cuò)是因?yàn)橄螺d不到需要的二進(jìn)制文件，執(zhí)行里本地編譯的操作，找不到 autoreconf 工具，程序退出。

查看 issue

在 gifsicle-bin 倉庫中翻著原因，發(fā)現(xiàn)作者在 v5.0.0 版本做了一句簡單的描述，去除了過時(shí)的和不安全的二進(jìn)制文件，估計(jì) linux 二進(jìn)制文件就在這個(gè)更新中被去除了。

去除之后，也并沒有看到要重新添加回來的打算（issue 113），所以只能靠我們先使用一些方法規(guī)避掉這個(gè)問題。

解決方案

找到原因之后，就有了以下兩個(gè)解決方案：

1. 將 gifsicle-bin 依賴版本降到 4+及以下；
2. 在 ci 服務(wù)器上，安裝編譯工具，命令如下：

## Linux:
$ sudo apt-get install libtool automake autoconf nasm
## OS X:
$ brew install libtool automake autoconf nasm