[TOC] > [esbuild.github.io](https://esbuild.github.io/getting-started/#download-a-build) > [中文](https://esbuild.bootcss.com/getting-started/#build-scripts) ## 概述 Esbuild是一款新一代的JavaScript打包和壓縮工具 。它使用Golang開發，速度非常快，可以比常見的打包工具快10~100倍 。與傳統的打包工具不同，Esbuild不使用AST，優化了構建流程 。它主打性能優勢，耗時只有Webpack的2%~3% 。Esbuild可以用于模塊化和ESM，提供了與Webpack、Rollup、Parcel相似的資源打包能力 。 <br/> **快的原因** * 它是用 Go 語言編寫的，該語言可以編譯為原生代碼； * 解析，打印和源映射生成全部完全并行化； * 無需昂貴的數據轉換，只需很少的幾步即可完成所有操作； * 編寫代碼時處處注意速度表現，并盡量避免不必要的配置 **支持類型** * CommonJS 模塊 * ES6 模塊 * 使用’–bundle’與 ES6 模塊的靜態綁定打包 * 使用’–minify’完全壓縮（空格、標識符和修飾符） * 啟用’–sourcemap’時，完全支持源映射 * .jsx 文件的 JSX 到 JavaScript 轉換 * 通過’–define’進行編譯時標識符替換 * 使用 package.json 中的’browser’字段進行路徑替換 * 自動檢測 tsconfig.json 中的’baseUrl’ ## 安裝 npm 安裝 ``` npm install -g esbuild-linux-64 # for Linux npm install -g esbuild-darwin-64 # for macOS npm install -g esbuild-windows-64 # for Windows npm install -g esbuild-wasm # for all other platforms ``` ## 場景 ### 瀏覽器環境 ``` esbuild app.jsx --bundle --minify --sourcemap --target=chrome58,firefox57,safari11,edge16 ``` - `--sourcemap` 可用戶開發環境 - ` --minify` 啟用壓縮 如果你引入的包只在node 中運行,可以通過配置 `package.json`進行配置,替換為瀏覽器友好的包 ``` { "browser": { "path": "path-browserify" } } ``` ### node 環境打包 ``` esbuild app.js --bundle --platform=node --target=node10.4 ``` 可對包進行壓縮,并且node 自帶的包不會打入進去,如`fs` 等 ### 開發與生產 開發 ``` esbuild example.jsx --bundle '--define:process.env.NODE_ENV="development"' --outfile=out.js ``` 生產 ``` esbuild example.jsx --bundle '--define:process.env.NODE_ENV="production"' --minify --outfile=out.js ```