前言
- ESbuild是一款基于Golang开发的打包工具，相比传统的打包工具，主打性能优势，在构建速度上可以快10~100倍
安装
- npm install esbuild
esbuild的使用
创建入口文件main.js
创建一个js文件，对main.js进行打包
- 调用esbuild包的buildSync方法
- 第一个参数entryPoints，入口点，配置入口文件，会以当前目录进行查找
- 第二个参数outfile，输出文件名称
用node执行当前js文件
- 打包后输出的内容跟源文件内容一样
加载器
- 每个内容类型都有一个关联的加载器，它告诉esbuild如何解释文件内容。
- 也就是类似webpack中的loader
加载器示例
- 修改main.js内容
重新打包，执行打包文件
- 我们会发现报错了，JSX扩展名没有被支持，要想支持必须配置loader
配置loader
- 为js文件配置jsx loader，这个jsxloader是内置的
配置bundle参数进行打包
重新执行打包文件
plugin插件
- 一个esbuild插件是一个包含name和setup函数的对象
实现一个esbuild插件-- esbuild-plugin-env
onResolve
- onResolve在查找文件路径时触发
- onResolve第一个参数是过滤器，当你其它文件里引入的模块路径匹配上了这个正则，就会触发这个钩子
- 第二个参数返回一个对象，path代表此模块的路径，表示未解析的模块路径
- namespace命名空间，如果不写的话，默认是 file，表示该esbuild在file命名空间运行，对应文件系统上的文件
- 但是esbuild也可以处理在文件系统上没有对应位置的“虚拟”模块
- 我们这里可以创建虚拟模块，也就是env。虚拟模块通常使用命名空间而不是file将它们与文件系统模块区分开来，通常命名空间特定于创建它们的插件
- 我们这个钩子的作用就是拦截env的导入路径，让esbuild不把它们映射到文件的系统中，用env-ns命名空间来标记它们，以使后面的插件可以处理它们
onLoad
- onLoad，决定模块内容
- 第一个参数是一个也是过滤器，它也是一个正则，当路径与这个正则不匹配时，将跳过注册的回调
- 第一个参数种也可以配置命名空间，namespace是可选的。如果提供，回调仅在提供的命名空间中的模块内的路径上运行。也就是说我们提供了命名空间，只会处理匹配到onResolve中注册的相同命名空间所对应的模块
- 第二个参数回调会返回一个对象，对象中返回内容contents和loader
