使用npm发布vue插件或组件库
1.先行再npm官网注册一个自己的npm账号;https://www.npmjs.com/
2.准备插件或组件库:
1)新建一个文件夹package作为写组件的地方
2)package文件夹内使用npm init命令初始化包,获得一个package.json文件,package.json包含作者,npm包名称,说明,作者及入口等属性
main属性是入口文件
3)同级文件夹下准备入口文件index.js,内容如下
import workForm from './views/workIndex.vue'
export default {
install: (app) => {
//空判断
app.config.globalProperties.$isNotEmpty = function (obj) {
return (obj !== undefined && obj !== null && obj !== '' && obj !== 'null')
}
//获取默认值
app.config.globalProperties.$getDefalut = function (obj, key, df) {
return (obj === undefined || key === undefined || !this.$isNotEmpty(obj[key])) ? df : obj[key];
}
//深度克隆
app.config.globalProperties.$deepCopy = function (obj) { return JSON.parse(JSON.stringify(obj)) }
//全局挂载组件
app.component('workForm',workForm)
}
}
4)新建README.md说明文件
3.在package文件夹根目录npm login,此时会让你提供注册npm账号时的账号密码邮箱,按照提示输入即可
1)如果npm login报错,可检查下是否使用了淘宝镜像,使用淘宝镜像是无法登录的,
2)切换回npm后,可使用npm who am i来查看当前登录账号
4.登录成功后执行npm publish进行推送,成功后即可使用npm install ‘包名’ 进行下载
1)包名是package中你定义的name属性
2)每次调整修改后,npm publish上传之前一定要修改version版本号,否则会报错
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?