components-zhjy-x3
v0.1.1
Published
一款实用的前端组件库
Downloads
2
Readme
前端组件库-智慧教育(components-zhjy)
安装依赖
npm install
添加组件
在components中添加组件
注意:组件的name必须要写,组件调试好以后,必须在/components/index.js中引入
打包组件库
运行npm run build:com打包组件库源码,打包后的文件在dist文件夹里,
其中components-zhjy.umd.js和components-zhjy.css两个文件需要用到
(将这两个文件拷贝到项目中,main.js中引入,即可在项目中使用添加的组件)。
npm run build:com
组件调试
在与components平级的目录创建了一个项目,名为examples,用于本地调试组件源码,
我们已经在 -> examples -> src -> main.js里引入components-zhjy.umd.js和components-zhjy.css两个文件,
这样可以使我们在 -> examples -> src ->App.vue 中直接使用components中的组件
在终端进入examples文件夹,首次启动时npm install安装依赖,然后npm run serve启动examples,我们可以看到组件注册并使用成功。
NPM包发布
先运行npm run build:com打包组件库,才能发布npm包
npm网站注册账号(是否使用公司账号?) npm
运行npm login命令登录npm账号,按照提示输入用户名密码邮箱等信息
(如果设置了淘宝镜像,会登录不成功,要将镜像改为npm官方镜像 npm config set registry https://registry.npmjs.org 查看镜像 npm config get registry)
最后运行npm publish完成npm包发布
(如果包名已存在,会发布不成功,换包名:-> package.json -> name 修改name,
同时"main": "dist/components-zhjy.umd.js"也要修改成对应路径,main: 本包向外暴露的文件,很重要,一定要和你打包出来的文件名一模一样)
参考文档 来,体会一下npm包的发布、更新管理、使用——完整教程
npm login
npm publish
快速上手搭建VUE组件库
See 参考文档.