使用 hooks 工程化 ionic 項目

如果你是希望看 api 那建議你去這里，本文只是一個思路不會提供代碼。

背景

ionic 打包其實很簡單， ionic build 一下就行了。但是當你需要切換 api 接口，支付寶、推送等插件的 appid（一般來說會分為開發環境，qa 環境，生產環境）時，會很煩并且容易出錯。不知道誰說過，好的工程師就應該懶，代碼能完成的事情，堅決不動手。

原理

ionic build 其實就是完成 ionic prepare（其實就是生成 www 目錄）和 ionic compile 兩個步驟。hooks 也會在他們之前或者之后執行，我這里以 before_prepare、after_prepare 兩個勾子為例：

1. before_prepare: ionic prepare 之前執行，也就是生成 www 目錄之前。這個時候適合做代碼壓縮（gulp）、刪除不必要文件（比如sass）。gulp 的部分就再也不用去手動執行 gulp build —release 了。

2. after_prepare: ionic prepare 之后執行，這個地方就可以做一些 appid 的替換工作，我們可以通過 process.env.CORDOVA_CMDLINE 獲取到命令行輸入。例如我輸入 ionic build —dev 或者 ionic build —release ，我就可以拿到當前打包需要的參數是 dev 本地開發配置，release 線上生產環境配置。

勾子

不知道大家在前端規范化的時候有沒有使用過 git hooks。幫助代碼規范的神器，簡而言之就是 commit 的時候，會觸發一次檢查代碼是否規范的程序。

本文的 hook 與該方法類似，使用 nodejs 來獲取參數做文件操作生成工程。nodejs 操作文件相關的代碼我就不貼了（其實是因為 node 根本不會寫）。提供一些hooks 實例，這些代碼都很棒，大家可以去學習一下：

希望看完本文，大家能對 ionic 打包的流程做一個更自動化的改造。還是那句話：好的程序猿，應該懶起來。