Tree-shaking 的其他注意事項 (WIP)
Table of Contents
Tree-shaking 的其他注意事項 (WIP)
- 不同的 import 方式怎麼影響 tree-shaking
- lodash-es 實例示範
- 如何確認打包結果有成功完成 tree-shaking？
- 一個有趣的 TypeScript warning
- 各個 bundler 怎麼做到 tree-shaking？
- 結論
參考資料與延伸閱讀
幾乎把所有能查到討論 tree-shaking 的中、英文文章都看了一輪，也附上一些覺得可以延伸閱讀的部分，或想看看其他資源也可參考以下文章，感謝這些文章讓我能站在巨人的肩膀上：
- Webpack 官方文件 - Tree-shaking
- Rollup - tree-shaking、tree-shaking 設定
- web.dev - Reduce JavaScript payloads with tree shaking
- patterns.dev - Tree-shaking
- Deep Dive Into Tree-Shaking
- How To Make Tree Shakeable Libraries
- guychienll - 深入解析 Webpack Tree shaking
- Andy - 原來程式碼打包也有這麼多眉角 - 淺談 Tree Shaking 機制
- 神Q超人 - 精準的打包 — Webpack 的 Tree Shaking
- KyleMo - Day15 X Tree Shaking
- 前端實力三明治 - React 元件庫製造紀事錄 (三) – Rollup Bundler 實作，並探究 Webpack 的 Tree Shaking
- Webpack 中的 sideEffects 到底该怎么用？
另外若想補充了解什麼是 ESM 及 JS 的模組化觀念：
- javascript.info - Modules
- Huli - webpack 新手教學之淺談模組化與 snowpack
- PJCHENder - [JS] JavaScript 模組（ES Module, ESM）
因為我也是第一次深入看這個部分，如果文章中有哪裡需要勘誤或有任何問題，請在下方留言或私訊 IG 告訴我，也感謝你的閱讀！
