如何上傳一個自己的 npm 包

介紹

本篇文章主要為面向還沒有上傳過自己的 npm 包，或者時間久想要回憶下的同學。

學習本篇文章你需要做以下准備工作：

1. 對 npm 有簡單了解
2. 知曉鏡像，及對應管理鏡像的 nrm 依賴
3. 需要有 npm 賬號，沒有的話需要去注冊一個
4. 准備上傳到 npm 的項目一個，最好文件夾名與上傳的包名統一
5. 了解 npm 包的命名規則
6. 確保自己命名的 npm 包的名稱在 npm 官網搜索不到，或沒有相近名稱的包

以上都准備好的話，就可以按照步驟一步一步實現上傳自己的包了。

本篇以一個簡單的‘時間轉周幾’的包來實現，過程不大嚴謹，也未考慮過多的復雜場景，適合新手拿教程使用。

1. 注冊 npm 賬號

步驟：

1. 打開 npm 官網
2. 點擊 sign in
   
3. 依據提示注冊，注意郵箱一定要寫一個自己使用的，因為 npm 會做郵箱認證，這將影響到接下來的 npm 包上傳
4. 注冊完成后會自動登錄，這個時候 npm 官方會發送驗證郵件，需要登錄郵箱 > 點擊鏈接 > 點擊 continue，郵箱驗證完畢

2. 准備上傳的 npm 包文件

1. 首先進入文件夾，執行 npm init，初始化自己的 package.json 文件，下圖是我的要上傳的 npm 包文件夾
   

2. 注意 npm init 中，name 就是自己要上傳的包的名稱，version 就是版本名稱，git repository 是倉庫鏈接，可不寫，author 是作者名，description 是對包的一個功能描述，main 是指向入口文件，一般默認 index.js 就好。這里面 name 和 version 是一定要填寫的，其他可根據需要填寫

3. npm init 執行完畢並生成 package.json 文件

4. 准備入口文件 index.js

5. 准備要實現的功能文件，我是放在了 src 文件夾下

6. 入口文件引入放在 src 文件夾下的功能文件

3. 本地測試

以上都准備完畢了，就可以先本地測試一版了，本地測試通過后就可以上傳了。另：本地測試推薦使用全局測試，這樣就可以在任意文件目錄使用了，測試命令 npm link
這里的根目錄統一為 zxn-date-formater 文件夾根目錄

1. 在要上傳的 npm 文件根目錄下執行 npm link，生成全局的 npm 包
2. 再去需要驗證的某個項目根目錄下執行 npm link [包名]，這時就會發現在 node_module 文件夾下找到這個文件
3. 引入依賴並測試

4. 上傳 npm 包

在要上傳的 npm 包根目錄下執行以下步驟，並確保此時的鏡像是指向了 npm 的，如果不是可通過 nrm ls 查看當前有哪些鏡像，並 nrm use [鏡像名] 切換鏡像

1. 執行 npm adduser，輸入自己的賬號、密碼、郵箱
2. 執行 npm whoami，查看是否是自己賬號，如果顯示出自己賬號則代表成功
3. 執行 npm publish，如果一切順利則會推送成功，如果報錯則問題一般是鏡像不是 npm，或者包名在 npm 中已存在，或存在相近的

5. 驗證上傳的 npm 包

方式一：登錄自己的 npm 賬號，可看到自己的倉庫里已經有相應的包，可點擊名稱進入查看

方式二：npm i [包名]，下載下來自己的 npm 包，並驗證執行，如：

npm i zxn-date-formater -D

可在 package.json 文件中看到已引入了該依賴，然后可正常在文件中引入，如：

import getWeekDay from 'zxn-date-formater'

console.log(getWeekDay('2021-12-15'))

最后

感謝這幾篇文章的作者
本地調試 npm 模塊 —— npm link
如何發布個人npm包