认识

2023年12月19日

柏拉文

越努力，越幸运

一、认识

---

仅仅使用 EsBuild 内置的打包能力很难满足项目日益复杂的构建需求。对于一个真实的项目构建场景来说，我们还需要考虑到模块打包之外的问题，比如路径别名(alias) 、全局变量注入和代码压缩等等。EsBuild 很多场景的处理逻辑与核心的打包逻辑都写到一起，一来打包器本身的代码会变得十分臃肿，二来也会对原有的核心代码产生一定的侵入性，混入很多与核心流程无关的代码，不易于后期的维护。因此 ，EsBuild 设计出了一套完整的插件机制，将自身的核心逻辑与插件逻辑分离，让你能按需引入插件功能，提高了 EsBuild 自身的可扩展性。

二、语法

---

2.1 编写语法

Esbuild 插件结构被设计为一个对象，里面有 name 和 setup 两个属性，name是插件的名称，setup是一个函数，其中入参是一个 build 对象，这个对象上挂载了一些钩子可供我们自定义一些钩子函数逻辑。

const Plugin = {
  name: 'Plugin',
  setup(build) {
    // do something
  }
}

2.2 配置语法

require('esbuild').build({
  entryPoints: ['src/index.jsx'],
  bundle: true,
  outfile: 'out.js',
  plugins: [Plugin],
}).catch(() => process.exit(1))