全新打包工具-Parcel介紹

Parcel的特性

• 快速打包 - 多核編譯，以及文件系統緩存，即便在從新啓動以後也能快速從新構建。
• 支持JS，CSS，HTML，文件資源等- 不須要安裝任何插件。
• 在須要的時候自動使用Babel，PostCSS和PostHTML自動轉換模塊 - 甚至是node_modules。
• 零配置代碼拆分，使用動態import語句分割。
• 內置支持模塊熱替換
• 友好的錯誤記錄體驗，語法突出顯示的代碼幀有助於查明問題。

比較

基於一個合理大小的應用程序，包含1726個模塊，未壓縮有6.5M 。構建在2016年的MAcBook Pro，4核物理CPU。

打包工具	時間
browserify	22.98s
webpack	20.71s
parcel	9.98s
parcel - 開啓緩存	2.64s

爲何須要Parcel？

目前已經有不少的打包工具了，包括webpack和browserify。那麼爲何咱們還須要另一個呢？主要緣由是由於開發者的經驗。

許多的打包工具都是圍繞着配置和插件構建的，並且爲了讓應用正常的工做，超過500行的配置並不罕見。這些配置不只繁瑣並且耗時。一般狀況下，這可能致使次優化的應用發送到生產環境。parcel被設計成零配置的：只須要將它指向應用程序的入口點，它就能正常工做。

目前現存的打包工具都很是慢。擁有大量文件和依賴的大型應用可能須要花費幾分鐘的時間來構建，這在開發過程當中隨着時間的變化而變得尤其痛苦。監聽文件變動可以幫助從新構建，但初始的啓動仍然很是慢。parcel利用工做線程編譯你的代碼，利用現代的多核處理器能力。這致使了初始構建的速度大大提高。它還具備一個文件系統緩存，能夠保存每個文件的編譯結果，以便後續可以更快的啓動。

最後，現有的打包工具都是圍繞字符串加載/轉換構建的，其中轉換須要一個字符串，解析它，進行一些轉換，而後再次生成代碼。一般這樣會致使許多的解析和代碼生成在單個文件上運行，這是很是低效的。相反，parcel的轉換工做在AST上，所以每一個文件只有一個解析，多個轉換以及一個代碼生成。

Parcel如何工做的？

parcel將資源樹轉換爲bundle樹。許多其它的打包工具基本上都是基於js資源，其它格式都是粘貼的-例如，默認狀況下以字符串的形式內嵌到js中。parcel是文件類型無關的-它能夠按照你指望的方式與任何類型的資源一塊兒工做，無需配置。

parcel將一個入口點做爲輸入，能夠是任何類型的：JS文件，HTML，CSS，圖片等。在parcel中定義了各類資源類型，它們知道如何處理特定的資源類型。資源文件被解析，它的依賴關係被提取，並轉換成最終的編譯形式。這建立了一個資源樹。

一旦資源樹被構建，資源就被放入一個bundle樹中。爲入口資源建立一個bundle，併爲動態導入的資源建立子bundle，這回致使代碼拆分的發生。當導入不一樣類型的資源的時候就會建立子bundle，例如若是你在js中導入css文件，它就會打包成對應js的兄弟bundle。若是一個資源須要多個bundle，它會被打包到最近的共同祖先，所以它不會被包含屢次。

在構建bundle樹以後，每個包都有特定的文件類型的包裝器寫入文件。

原文地址：https://github.com/parcel-bundler/parcel