1.初始化项目
npm init
2.开发工具库内容
新建文件夹src
新建文件index.js
输入要发布的工具库函数
/**
* 对象数组深拷贝
* @param {Array,Object} source 需要深拷贝的对象数组
* @param {Array} noClone 不需要深拷贝的属性集合
*/
export function deepClone(source, noClone = []) {
if (!source && typeof source !== 'object') {
throw new Error('error arguments', 'deepClone')
}
const targetObj = source.constructor === Array ? [] : {}
Object.keys(source).forEach(keys => {
if (source[keys] && typeof source[keys] === 'object' && noClone.indexOf(keys) === -1) {
targetObj[keys] = deepClone(source[keys], noClone)
} else {
targetObj[keys] = source[keys]
}
})
return targetObj
}
使用rollup打包该工具库//rollup会将代码打包成一个文件//最简单的rollup配置文件
export default {
input:'src/index.js',
output:{
file: './dist/index.js', // 必填//最终打包出来的文件路径和文件名,//不配置直接导出到控制栏
format: 'umd', //必填// umd是兼容amd/cjs/iife的通用打包格式,适合浏览器,不设置该选项导出代码无法运行(无法识别export)
name:'index',//导出的文件名称//必填
}
}
工具库开发完了接下来就是发布了
1.首先需要注册npm账号
注意:注册成功后在邮箱中验证一下,否则发布之后会有403报错
2.npm adduser //输入用户信息,
3.npm publish //执行发布操作
至此一个npm包就发布成功了,就可以通过npm i 包名
下载到这个工具库
注意:如果想通过cnpm下载到刚发布的包需要等待大概10分钟,cnpm(淘宝镜像大概10分钟同步一次)
4.更新包,和发布一个步骤
注意:版本号不能相同,需要修改package.json里的版本号才能更新,packjson中需要通过main属性导出内容
5.常见错误
1错误码E403
code E403
npm ERR! 403 403 Forbidden - PUT registry.npmjs.org/js-utils -* You do not have permission to publish "js-utils". Are you logged in as the correct user?*
npm ERR! 403 In most cases, you or one of your dependencies are requesting
npm ERR! 403 a package version that is forbidden by your security policy.
问题可能原因: 1.第一次发布:账号未登录
2.账号邮箱未验证
3.发布包名已被占用导致无权限
4.确实没权限...
2.发布包的时候报错reason: connect ETIMEDOUT 104.16.27.34:443 可能是dns的问题,尝试刷新DNS缓存
//window
ipconfig /flushdns
// #macOS/Linux 下执行
sudo dscacheutil -flushcache
3.发布后搜不到发布的包,只能个人中心看到
4.发布后无法通过npm install xxxx 安装依赖
报错信息
npm ERR! code EUNSUPPORTEDPROTOCOL npm ERR! Unsupported URL Type "workspace:": workspace:*
原因:因为包本身使用yarn安装的依赖,可能带有workspace的地址,所以改成用yarn add xxx就可以了