詳解：如何在NPM上發佈自己的第一個腳手架工具

前言

腳手架工具能快速生成一個完整的項目結構，幫助開發人員專注於項目開發，十分高效。

表面高大上的腳手架工具，背後的實現原理其實並不複雜。例如 vue-cli 其本質上就是根據不同的操作指令在遠程倉庫（例如：GitHub）把不同的模版拉取到本地。

本文將結合作者的腳手架（lan-cli）實例，爲讀者快速講述如何創建一個腳手架併發布到NPM上。

受限於文章篇幅，本文不會對項目代碼進行講解，具體的代碼存放在文末的GitHub項目地址上。

技術棧

1. nodejs：腳手架框架核心；
2. commander：處理命令行輸入；
3. co：異步流程控制工具；
4. co-prompt：分步輸入命令行指令。

大綱

1. 創建項目；
2. 編寫指令；
3. 配置腳手架信息；
4. 本地測試；
5. 發佈腳手架。

實例講解

1. 創建項目

如圖所示創建一個類似的工程文件。

2. 編寫指令

lan-cli的指令一共有四個。

1. lan add ：添加腳手架的項目模板；
2. lan list ：列出腳手架的項目模板；
3. lan delete ：刪除腳手架的項目模板；
4. lan init ：初始化腳手架的項目；
   
   指令代碼在如圖文件中。

3. 配置腳手架信息

如圖所示在package.json文件中配置好腳手架的信息。

4. 本地測試

bin/lan是腳手架的入口文件，並且在package.json中配置如下代碼。

"bin": {
        "lan": "bin/lan"
    }

配置好入口文件後，在根目錄下的命令行輸入npm link，就可以把lan命令綁定到全局，直接使用測試腳手架工作是否可以正常運行。

5. 發佈腳手架

完成腳手架後，我們就可以發佈到NPM上了。

首先需要到 npm （https://www.npmjs.com/）上註冊一個賬號，註冊過程略。

然後在終端執行登錄命令，輸入用戶名、密碼、郵箱即可登錄。

npm login

登錄成功後，輸入命令，發佈組件。

npm publish

發佈成功後，一般會有npm發送給你的通知郵件，進入npm官方，登錄自己的賬號，查看剛剛發佈的組件庫。

項目地址

本文項目Github地址：https://github.com/jiangjiaheng/Learn-NPM/tree/master/Scaffold/lan-cli。

結語

以上就是本文的全部內容了，感謝你的閱讀，文中部分技術要點受限於文章篇幅，並沒有展開講解，如果你有什麼疑問或者建議，歡迎你隨時留言，互相討論。

最後，祝工作順利，生活幸福。