发布工具包

---

目标

• 一个项目下来, 自己用原生js, 封装了些工具

• 发布这些工具到npm网站

• 以后换电脑, 直接npm/yarn下载即可

步骤-准备

1. 新建文件夹, 并初始化包环境npm init

得到package.json文件

重要: ==包名, 入口==

2. 把要发布的js文件拿过来

基于原生js的最好, 任何项目通用的代码, 都可以

• date.js里基于dayjs的

• directives.js里基于vue的

下载包, npm install dayjs vue

3. 创建index.js(package.json记录入口文件名字统一), 然后把其他模块的方法统一导入并导出

// 包的唯一出口
export*from'./date'// 基于dayjs的时间处理
export*from'./directives'// 基于vue的自定义指令
export*from'./storage'// 原生js封装storage存储
export*from'./str'// 原生js封装字符串高亮

步骤-发布

1. 切换本机npm镜像地址

注意npm镜像笔记切换到原来的才能发布工具包

npmconfigsetregistry=https://registry.npmjs.org/

查看npm镜像地址命令: npm config get registry

2. 去https://www.npmjs.com/ 这个网站注册账号

一定要用能登录上去的邮箱
一定要去邮箱里有一封验证, 点击链接激活
一定切记账号和密码和邮箱, 发布包使用

3. 在发布包的文件夹下cmd终端

• 命令: npm login

作用: 建立登录链接
输入上一步注册的账号和密码和邮箱
终端为了防止密码被偷窥, 不会提示, 但实际上已经输入进去了

• 命令: npm publish

作用: 发布所在文件夹这个包上去

出现这个图就代表成功了, 如果报错请到这里查看报错解决方案:

http://lidongxuwork.gitee.io/error/

验证

1. 去npmjs网站查看

2. 也可以到任何一个地方, 用npm / yarn 下载刚才你发布的包名

这样全世界的程序员都可以下你的包了, 快去让你同桌小伙伴下载试试吧

小结

1. 为何要发布包?

• 可以提高自己知名度, 方便下个项目直接下载使用

2. 如果以后更新了, 重新发布?

• 把js文件放到本地包文件夹里, 在index.js统一导出

• 把package.json的版本向前改(因为每个版本号只能用一次)

扩展

包开发环境和生产环境到底有什么区别?

可以看这里: https://www.bilibili.com/video/BV15M4y1u78F