鐵人檔案
前端框架五花八門，可是建置工具卻只更新了 2 3 代而已，相較之下要來的穩定多了，這些工具如 webpack, babel 都是我們在現代開發前端時不知不覺之中得去使用到的工具，可是我們真的了解這些工具嗎？現在我們大多都靠著框架提供的基本設定就搞定了這些工具，會不會有一天，我們非得正面面對這些工具呢？比如只要正確的設定好 webpack 你就可以在打包時順便的對圖片做最佳化，還可以做 prerender 來提供更好的 SEO
這系列不只是介紹這些工具的使用方法，還會去探究它們底層的實作原理，以及如何寫個 plugin ，完全客制化這些工具的功能
前端框架五花八門，可是建置工具卻只更新了 2 3 代而已，相較之下要來的穩定多了，這些工具如 webpack, babel 都是我們在現代開發前端時不知不覺之中...
在開始之前先說一下，接下來這兩篇會是介紹這些工具的背景，並沒有任何的使用與實作，如果你已經知道這些工具的由來或是沒有興趣的，可以從 Day 4 再開始看起 如果...
webpack 以現在而言又是個在背後默默無名的功臣，不過如果你在 vue-cli 或是 create-react-app 誕生之前就在使用 React 或 V...
終於要開始講到實際應用了，由於 babel 是由多個模組與 plugin 組合起來的專案，於是不透過像 vue-cli 之類的專案建構工具的話就要安裝一堆東西很...
有時我們可能會有需要在不同的環境下提供不同的設定，或是針對不同的檔案提供不同的設定的情況，這時候有兩個東西可以使用： module.exports = {...
前面提過 babel 是個把程式碼編譯成程式碼的工具，本質上它還是個編譯器，所以它在做的事基本上就是編譯器在做的事，不過這邊會避免對編譯器的部份講的太細，重點是...
babel 實際上拆成好幾個套件，有些平常基本上也用不到，因為那一般而言是開發 plugin 時才會去接觸到的，這邊就來一一介紹跟 plugin 還有一般使用有...
介紹了這麼多，我們終於要來介紹怎麼寫個 plugin 了，這邊會盡量涵蓋大部份的用法，不過如果還是有缺的話可以去看超詳細的 Babel Handbook，不過它...
這邊的 scope 就是指變數的作用域， babel 在解析時也會去分析變數的使用情況，於是我們就有機會判斷一個變數實際的值是什麼，或是可以用來避免增加新的變數...
babel macro 是一個 babel 的 plugin ，它可以讓你把特殊的 babel 的 plugin 當成 package 來引入使用，這在 cre...
