目录
1.需要实现的功能
(1)格式化日期
(2)转义HTML中的特殊字符
(3)还原HTML中的特殊字符
2.初始化包的基本结构
(1)新建supertool文件夹,作为包的根目录
(2)在supertool文件夹里面,新建如下的三个文件:
package.json (包管理配置文件)
index.js (包的入口文件)
README.md (包的说明文档--官网上面也会以网页的形式展现出来的)
3.初始化package.json
名称 | 功能 |
---|---|
name | 在npm服务器上面的包名(这个名字和文件夹的名字是可以不一致的) |
main | 包的入口 |
description | npm官网上面查找的时候,搜素框下面提示框所显示的简介 |
keywords | 查找关键词 |
license | 所遵守的开源许可协议 |
{
"name" : "supertool",
"version": "1.0.0",
"main" : "index.js",
"description":“提供了格式化时间,HTMLEscape的功能",
"keywords" :["itheima",,"dateFormat", "escape"],
"license" : "ISC"
}
4.在index.js中定义格式化时间的方法
// 1.定义格式化时间的方法
function dataFormat(dtStr) {
//创建一个时间对象
const dt = new Date(dtStr);
const y = 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;
}
5.在index.js中定义转义HTML的方法
//定义转义HTML标签的函数
function htmlEscape(htmlStr) {
//里面需要定义一个全局匹配的匹配相应字符的正则表达式
return htmlStr.replace(/<|>|"|&/g, (match) => {
switch (match) {
case '<':
return '$lt';
case '>':
return '$gt';
case '"':
return '$qout';
case '&':
return '$amp';
}
})
}
6.在index.js中定义还原HTML的方法
//定义还原HTML字符串的函数
function htmlUnEscape(htmlStr) {
return htmlStr.replace(/$lt;|$gt;|$qout;|$amp;/g, (match) => {
switch (match) {
case '$lt;':
return '<';
case '$gt;':
return '>';
case '$quot;':
return '"';
case '$amp;':
return '&';
}
})
}
7.将不同的功能进行模块化拆分
(1)将格式化时间的功能,拆分到src -> dateFormat.js 中
(2)将处理HTML字符串的功能,拆分到src -> htmlEscape.js 中
(3)在index.js 中,导入两个模块,得到需要向外共享的方法
const data = require('./src/dataFormat');
const escape = require('./src/htmlEscape');
(4)在index.js 中,使用module.exports把对应的方法共享出去
// 定义的函数默认都是私有的,所以我们下一步是将这些方法给共享出去
module.exports = {
// ...是ES6中的展开运算符,就是将data对象里面的属性栏都展开,放在这里被该文件共享
...data,
...escape
}
8.编写包的说明文档
(1)包根目录中的README.md文件,是包的使用说明文档。通过它,我们可以事先把包的使用说明,以 markdown的格式写出来,方便用户参考。
(2)README文件中具体写什么内容,没有强制性的要求;只要能够清晰地把包的作用、用法、注意事项等描述清楚即呵。
(3)我们所创建的这个包的 README.md文档中,会包含以下6项内容:
安装方式、导入方式、格式化时间、转义HTML中的特殊字符、还原HTML中的特殊字符、开源协议
具体代码文件可点击 示例代码文件 进行下载
9. 发布包
9.1.注册npm账号
访问https://www.npmjs.com/网站,点击sign up按钮,进入注册用户界面
填写账号相关的信息:Full Name、Public Email、Username、Password
点击 Create an Account按钮,注册账号
登录邮箱,点击验证链接,进行账号的验证
9.2.登录npm账号
npm账号注册完成后,可以在终端中执行npm login 命令(并不是在网站中执行命令),依次输入用户名、密码、邮箱后,即可登录成功。
注意:在运行npm login命令之前,必须先把下包的服务器地址切换为npm的官方服务器。否则会导致发布包失败!(可以先使用nrm看一下)
9.3.把包发布到npm官方服务器上
将终端切换到包的根目录之后,运行npm publish 命令,即可将包发布到npm上
(注意:包名不能雷同——在咱们发布之前,最好是在npm官网上面查看一下有没有相似的包名)。
9.4.删除已发布的包
运行npm unpublish 包名 --force ,即可从npm删除已发布的包。
注意:
npm unpublish命令只能删除72小时以内发布的包
npm unpublish 删除的包,在24小时内不允许重复发布
发布包的时候要慎重,尽量不要往npm 上发布没有意义的包!
整理不易,给个赞再走呗!当然,也欢迎指正哈~