开发一个属于自己的npm包_自己的功能做npm包-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_45525630/article/details/119021552

本文介绍如何从零开始创建并发布一个npm包，包括初始化项目、实现功能模块如日期格式化和HTML转义，以及最终发布到npm的过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天跟大家分享一下怎么开发一个简单的属于自己的npm包

文章目录

一、初始化包
- - - 1.新建 vwen 文件夹，作为包的根目录
    - 2.在 vwen 文件夹中，新建如下三个文件和src文件夹：
二、发布自己的npm包
总结

一、初始化包

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（将不同的功能进行模块化拆分）

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
}