開發屬於自己的包，並上傳到npm上

阿新 • • 發佈：2021-10-09

1.DIY開發包

1.1符合標準的包結構

一個規範的包，它的組成結構，必須符合以下3點要求：

包必須以單獨的目錄而存在
包的頂級目錄下，必須包含package.json這個包管理檔案
package.json中必須包含name,version,main這三個屬性，分別代表包的名字、版本號、包的入口
注意：以上 3 點要求是一個規範的包結構必須遵守的格式，關於更多的約束，可以參考這個網址

1.2初始化包的專案結構

新建ccljy_date資料夾，作為包的根目錄，儘量不要中文命名，以避免不必要的麻煩
在 ccljy_date 資料夾中，新建如下三個檔案：

package.json (包管理配置檔案)，在專案根目錄開啟cmd視窗，輸入npm init -y

快速建立
index.js (包的入口檔案)
README.md (包的說明文件)
圖示：

1.3初始化`package.json` 配置檔案

{
  "name": "flightloong-tools",
  "version": "1.0.0",
  "description": "提供格式化時間、HTMLEscape相關功能",
  "main": "index.js",
  "keywords": [
    "itcast",
    "itheima",
    "dateFormat",
    "escape"
  ],
  "license": "ISC"
}

1.4在 `index.js`

中定義格式化時間的方法

// 包的入口檔案 index.js

// 定義格式化時間的函式
function dateFormat (dateStr) {
  const dt = new Date(dateStr)

  const y = padZero(dt.getFullYear())
  const m = padZero(dt.getMonth() + 1)
  const d = padZero(dt.getDate())

  const hh = padZero(dt.getHours())
  const mm = padZero(dt.getMinutes())
  const ss = padZero(dt.getSeconds())

  return `${y}-${m}-${d} ${hh}:${mm}:${ss}`
}

// 定義一個補零的函式
function padZero (n) {
  return n > 9 ? n : '0' + n
}

// 向外暴露需要的成員
module.exports = {
  dateFormat
}

1.5編寫包的說明文件

包根目錄中的 README.md 檔案，是包的使用說明文件。通過它，我們可以事先把包的使用說明，以 markdown 的格式寫出來，方便使用者參考
README 檔案中具體寫什麼內容，沒有強制性的要求；只要能夠清晰地把包的作用、用法、注意事項等描述清楚即可
我們所建立的這個包的 README.md 文件中，會包含以下 6 項內容

安裝方式
匯入方式
格式化時間
轉義 HTML 中的特殊字元
還原 HTML 中的特殊字元
開源協議

### 安裝
```
npm i ccljy_date
```

### 匯入
```js
const date = require('./ccljy_date')
```

### 格式化時間
```js
// 呼叫 dateFormat 對時間進行格式化
const dtStr = date.dateFormat(new Date())
// 結果  2020-04-03 17:20:58
console.log(dtStr)
```
### 開源協議
ISC

2.註冊 `npm` 賬號

訪問 npm 網站，點選 sign up 按鈕，進入註冊使用者介面
填寫賬號相關的資訊：Full Name、Public Email、Username、Password
點選 Create an Account 按鈕，註冊賬號
登入郵箱，點選驗證連結，進行賬號的驗證

3.登入 `npm` 賬號

npm 賬號註冊完成後，可以在專案根目錄，開啟cmd終端中執行 npm login 命令，依次輸入使用者名稱、密碼、郵箱，每輸完一個內容，按回車，即可登入成功（儘量選擇網路良好的環境）
注意：在執行 npm login 命令之前，必須先把下包的伺服器地址切換為 npm 的官方伺服器。否則會導致釋出包失敗！