blogfoster-scripts:一款簡化 Node.js 項目初始化的工具
背景
在開發的過程中,開發者們會不時的接觸到一些新的工具。當他們覺得某個新的工具很有趣,並且想把這個新工具運用到自己的項目中去的時候,一般來說他們會做以下這幾件事:
移除舊的工具(與新工具具有同樣功能)
當開發者覺得這個工具很好用,可以取代以前舊的工具的時候,他們就會想要把這個工具添加到所有的項目中去。
於是,問題來了。
如果有幾十個甚至幾百個項目,逐個項目進行安裝新工具,配置新工具的過程將會消耗大量的時間!那麼怎麼樣才能花費較少的時間而又能完成上述任務呢?
思路:降低配置的複雜度
如果新工具的配置只需要很少的配置,開發者就能夠節約大量為配置工具所花費的時間。
典型的例子是 facebook 出品的 create-react-app 工具。這個工具提供了一個外部介面和不同的選項(build, start, test 等)給開發者,讓開發者選擇不同的webpack,ESLint 或者 Jest 的用法。這使得開發者不需要了解背後的所有工具是怎樣配置好的就能夠直接上手進行開發,從而極大的減少了配置新項目所需要花費的時間。
但是這種做法也存在自己的缺點,主要包括以下 3 點:
在這個例子中,配置簡化的代價是開發者主觀能動性的減少。比如你不能夠在 SASS 中定義自己的樣式,配置中沒有你特別喜歡的某些 babel 插件等。
那麼,有沒有一種方法,既能夠使得開發者不需要為配置文件而煩惱,同時又能滿足開發者自定義工具的需求呢?
不完美解決方法
Kent G. Dodds 設計了 paypal-scripts 來嘗試解決上述問題。在用戶沒有自定義配置的情況下,paypal-scripts 會作為默認的配置文件進行工作,當開發者自定義了配置文件時,自定義的配置文件會優先於內部配置文件執行。從而解決了開發者不能自定義配置工具的問題。
這個解決方案最大的問題在於:當越來越多的項目都傾向於自己配置文件覆蓋原始配置文件的時候,我們就又重新回到了第一個問題。同時,API 介面也會變得越來越複雜。
blogfoster-scripts 的解決方法
blogfoster-scripts 是 blogfoster 團隊為了解決上述問題而開發的一個工具箱。
與 paypal-scripts 相比,它主要做了以下 2 點改進:
這樣一來,當我們需要開始一個新項目的時候,只需要運行 npm install --save-dev blogfoster-tools 就可以了。
blogfoster-scripts 使得開發者可以一次性的解決多有項目中某一個問題,從而極大的提高了開發體驗。
附 blogfoster-scripts 使用說明
安裝:npm install --save-dev blogfoster-tools
package.json 中配置:
{
"scripts": {
"lint": "blogfoster-scripts lint",
"format": "blogfoster-scripts format",
"build": "blogfoster-scripts build"
}
}
內置子命令:
lint:根據ESlint檢查語法錯誤
format:根據Prettier修改代碼的格式
build:將JS代碼准換成ES5代碼,並根據Webpack和Babel定義的方法複製靜態文件


TAG:編譯青春 |