parcel-v1.6.0更新日誌(翻譯)

繼續來一個純手打翻譯node

文章是Parcel的主要開發者devongovett寫的, 很值得一看, 因而翻譯併發布出來. 原文連接react

關聯一下之前發佈過的將typescript+react的webpack項目遷移到parcelwebpack

📦 Parcel v1.6.x: ES6+/JSX零配置, 支持Node/Electron應用, 打包統計分析, 以及各項更新和改進! 🚀

查看Githubgit

Parcel更新很迅速. Parcel v1.6.0是繼v1.5.0三週後的一個重大更新, 其中包括超過15項新特性, 大量的bugfix和改進. 較爲突出的有:github

  • 🐠 ES6+ Babel編譯零配置 — 最新版本更容易讓你的項目以更少的配置啓動: .babelrc如今是可選的! 當你使用babel-preset-env時, Parcel自動編譯ES6+ (包括node_modules!), 並且你能夠輕鬆地經過在package.json中指定一個browserslist key覆蓋默認瀏覽器target
  • ⚛️ 默認支持React/Preact的jsx語法 — JSX支持在最新版本是徹底自動支持的, 無需額外配置! 若是你正在寫React/Preact的程序, 你不在須要一個.babelr文件來啓動, Parcel若是檢測到你在使用React/Preact, 會爲你自動開啓JSX語法支持. 👌
  • 🌐 Node/Electron targets — Parcel如今支持打包Node/Electron應用了. 這些環境的原生特性好比fs的內聯使用是不被容許的, 並且node_modules也不會被打包.
  • 📊 生產環境打包分析 — 如今當你打包生產環境代碼時, Parcel能記錄每一個bundle的大小和編譯時間. 做爲一個可選項, 您能夠查看更詳細的報告, 列出每一個包中最大的文件, 以幫助您優化.
  • 6️⃣ Node 6支持 — Parcel如今能夠在Node 6版本上跑了. 若是你仍是用Node 6如下的版本, Parcel是運行不了的.
  • 3C WebManifest支持 — 對PWA應用來講這是很重要的, Parcel能夠解釋你的HTML中的.webmanifest文件, 處理好比homescreen icons這樣的依賴, 還有service workers
  • 一些bugfix和改進

很是感謝爲此做出貢獻的人. 🙏web

Babel編譯零配置

Babel在Parcel中一直是開箱即用的, 用以編譯現代JavaScript爲瀏覽器可用的代碼. 可是, 在此以前, 你仍然須要寫一個.babelrc配置文件以及安裝一些必要的presets/plugins.typescript

如今再也不須要了! Parcel如今默認使用babel-preset-env, 支持零配置地按照你指定的瀏覽器/node環境去編譯現代JavaScript: .babelrc再也不是必需的了. 👌express

默認狀況下, Parcel爲具備> 1%市場份額的引擎編譯瀏覽器代碼, Node環境的話是編譯到當前LTS版本(如今是6.0.0), 可是你能夠在package.json中指定一個browserslist值來覆蓋.npm

Parcel一樣支持編譯node_modules中的ES6+代碼! 若是一個模塊的指定target高於程序的版本, 這個模塊編譯時的target會被降至程序的targets. 這意味使用ES6+寫的模塊能夠發佈到npm倉庫, 同時你的程序仍然能夠不用任何配置就使用這些模塊. 模塊僅僅會在必要時候被編譯: 若是ES6 classes在程序中被支持, node_modules中的classes不會被編譯json

當你須要額外的配置時, .babelrc文件仍然是能夠被檢測到的. 然而,這再也不適用於node_modules,只有應用程序中的代碼才適用,由於以前的作法形成了太多的問題.

默認的React/Preact JSX語法支持

繼續這個主題, Parcel v1.6.x一樣支持了JSX的開箱即用. Parcel會自動檢測你是否安裝了React/Preact依賴, 開啓JSX語法支持, 而且選擇你正在使用的庫的正確的JSX編譯指示. 默認是React, 但是Preact也是支持的, 若是你願意去社區貢獻的話, 要加上其餘庫也是很容易的.😍

這兩個特性 — babel-preset-env零配置, 默認支持JSX語法 — 組合起來提供了一個React程序的完整的零配置起點. 不須要更多的配置Babel就能夠啓動程序! 若是你須要開啓一些額外的特性, 你仍是能夠後續加一個.babelrc. 👏

感謝Sheel Patel爲Parcel新增了這個特性! 🏆

Node/Electron Targets

Parcel開始時是爲web程序提供一個快速, 零配置的開發體驗. 可是今天, JavaScript的使用已經超出了web瀏覽器, 它能夠被使用在服務器, 桌面, 移動apps...

Parcel v1.6.0 如今爲Node/Electron提供了targets, 爲其對應的環境友好地輸出代碼. 因爲這些環境都有它們自有的模塊系統, 而且提供一些好比filesystem的原生方法, 當你指定targets爲Node/Electron時Parcel禁用了若干爲瀏覽器鋪墊的特性.

不是就近的依賴(好比 import express from 'express') 會被指定爲從node_modules獲取並按原樣保留, 不打包. 就近依賴的(好比import car from './car') 則照常打包.

fs.readFileSync不打包

Buffer, __dirname這些全局變量不打包

Hot Module Loading runtime不打包(for --target=node)

若是是默認設置--target=browser, 你的瀏覽器app照常不變

感謝Guilherme Bernal爲Parcel新增了這個特性! 👏

生產環境打包分析

當爲生產環境打包時, Parcel如今能夠記錄分析關於包的大小和構建時間. 搭配--detailed-report使用, Parcel同時會提供每一個包中按文件大小分列的頂層資源的細目. 當有一個很是大的包時, 它甚至會警告你應該去看看. ⚠️

我但願未來進一步擴展並完善這個功能, 以便更深刻地瞭解你的代碼.

感謝Jasper DeMoor爲這個特性持續努力! 🏅

來試試吧!

Parcel還有很長的路要走,咱們纔剛剛開始。我等不及要看你用它來作些什麼了!

若是你發現任何bug, 能夠在Github上面向咱們報告. 也能夠在Twitter上@devongovett

相關文章
相關標籤/搜索