一、初始化包

1.建立 vwen 檔案夾，作為包的根目錄

2.在 vwen 檔案夾中，建立如下三個檔案和src檔案夾：

package.json （包管理配置檔案）

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

其中name屬性是包的名稱，可以先去包網站看一下會不會重複，version是版本号，預設的初始版本号是1.0.0，main是包的入口檔案，其實就是外界使用require來導入包的時候，導入的就是main屬性指向的這個檔案，description是包的簡短的描述資訊，keywords是搜尋的關鍵字，license是包所遵循的開源許可協定，npm預設希望遵循ISC開源許可協定。

index.js （包的入口檔案）

// 這是包的入口檔案
// 到時候導入就是導入這個包
// 向外暴露需要使用的成員,在外部就可以使用
const date = require('./src/dateFormat');
const escape = require('./src/htmlEscape');
module.exports = {
    // 把對象展開，展開運算符
    ...date,
    ...escape
}

src（将不同的功能進行子產品化拆分）

開發一個屬于自己的npm包一、初始化包二、釋出自己的npm包總結

dateFormat.js

// 定義格式化時間的方法
function dateFormat(datastr) {
    // 執行個體化一個Date對象把時間當參數傳進來
    const dt = new Date(datastr);
    // 擷取年月日時分秒
    const y = dt.getFullYear();
    // 因為擷取的月是從0開始的
    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) {
    // 如果是大于9就是兩位數傳回n，小于9就是個位數傳回前面加0
    return n > 9 ? n : '0' + n;
}
module.exports = {
    dateFormat
}

htmlEscape.js

// 定義轉義HTML字元的函數
function htmlEscape(htmlstr) {
    return htmlstr.replace(/<|>|"|&/g, match => {
        // 把那些符号都轉為實體字元
        switch (match) {
            case '<':
                return '&lt;'
            case '>':
                return '&gt;'
            case '"':
                return '&quot;'
            case '&':
                return '&amp;'
        }
    })
}
// 定義還原HTML字元串的函數
function htmlUnEscape(str) {
    return str.replace(/&lt;|&gt;|&quot;|&amp;/g, (match) => {
        switch (match) {
            case '&lt;':
                return '<'
            case '&gt;':
                return '>'
            case '&quot;':
                return '"'
            case '&amp;':
                return '&'
        }
    })
}
module.exports = {
    htmlEscape,
    htmlUnEscape
}

README.md （包的說明文檔）

開發一個屬于自己的npm包一、初始化包二、釋出自己的npm包總結

開發一個屬于自己的npm包一、初始化包二、釋出自己的npm包總結
最終項目結構

開發一個屬于自己的npm包一、初始化包二、釋出自己的npm包總結

二、釋出自己的npm包