您当前的位置: 首页 >  学无止境 >  文章详情

自定义npm组件库

时间: 2023-11-10 【学无止境】 阅读量:共308人围观

简介 前端开发经常需要使用到 npm 安装第三方库,那么如何将自己写的库上传到 npm 进行使用呢?

注册npm账号

注册好之后记得去填的注册邮箱里面验证一下

切换官方镜像源

// 修改 npm 源地址为官方源 $ npm config set registry https://registry.npmjs.org/

不切换有可能会导致无法登录

npm登录

// 登录命令 $ npm login // 按照要求填写登录信息 PS F:\python\zfx-design-vue\src\zfx-design> npm login npm WARN adduser `adduser` will be split into `login` and `register` in a future version. `adduser` will become an alias of `register`. `login` (currently an alias) will become its own command. npm notice Log in on https://registry.npmjs.org/ Username: zfx-design-vue Password: Email: (this IS public) xxxxx@qq.com npm notice Please check your email for a one-time password (OTP) Enter one-time password: Enter one-time password: 收到的邮箱验证码 Logged in as zfx-design-vue on https://registry.npmjs.org/.

登录成功后创建package.json

// 命令 npm init

创建成功后发布代码

// 普通包 npm publish // 出现以下错误,请修改版本号,版本号已存在了 npm ERR! code E403 npm ERR! 403 403 Forbidden - PUT https://registry.npmjs.org/zfx-design - You cannot publish over the previously published versions: 1.0.0. 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, or npm ERR! 403 on a server you do not have access to. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\Administrator\AppData\Local\npm-cache\_logs\2023-11-10T08_16_39_084Z-debug-0.log // 修改之后重新发布

发布成功后安装组件

// 安装命令 npm i zfx-design

拉取组件后使用

import { createApp } from 'vue' import './style.css' import App from './App.vue'; import router from "./router"; import { install } from './zfx-design'; const app = createApp(App) app.use(router) app.use(install) app.mount('#app')
文章评论
总共 0 条评论
这篇文章还没有收到评论,赶紧来抢沙发吧~
Copyright (C) 2023- 小祥驿站 保留所有权利 蜀ICP备 17034318号-2  公安备案号 50010302004554