自定义UI组件发布到npm仓库

一，进入npm官网注册账户。

1. npm官网：https://www.npmjs.com/

二，打开控制台，输入 nrm ls 查看源，需要保证当前源是npm源。

如果不是，则需要改回来 npm config set registry https://registry.npmjs.org/

PlainBashC C#CSSDiffHTML/XMLJavaJavascriptMarkdownPHPPythonRubySQL

#修改下载仓库为淘宝镜像

　 npm config set registry http://registry.npm.taobao.org/

#如果要发布自己的镜像需要修改回来

　 npm config set registry https://registry.npmjs.org/

三，输入 npm login 进行登录，（注意密码是隐藏的。还要输入邮箱验证码）

四，登录之后 npm publish 提交到npm仓库。（注意是在当前项目文件夹，并且你的项目名需要保证在npm仓库中没有，如果他人已创建该仓库名，则需要更换名称）

到这已经结束了，等待提交完成就行了，（如果下次还需提交，记得修改版本号，不能与之前一致）

打开项目输入命令 yarn add zhangweicheng-ui 即可安装自己的组件在项目中使用。

PlainBashC C#CSSDiffHTML/XMLJavaJavascriptMarkdownPHPPythonRubySQL

//安装组件

yarn add zhangweicheng-ui

//卸载组件命令

npm uninstall zhangweicheng-ui

在 main.js 中全局注册使用

PlainBashC C#CSSDiffHTML/XMLJavaJavascriptMarkdownPHPPythonRubySQL

//引入组件

import zhangweichengUi from 'zhangweicheng-ui'

//引入css

import 'zhangweicheng-ui/dist/zhangweicheng-ui.css'

//注册

Vue.use(zhangweichengUi)

在项目中使用

PlainBashC C#CSSDiffHTML/XMLJavaJavascriptMarkdownPHPPythonRubySQL

//基本按钮展示

<vae-button>原始按钮</vae-button>

<vae-button type="primary">百搭按钮</vae-button>

<vae-button type="success">成功按钮</vae-button>

<vae-button type="warning">警告按钮</vae-button>

<vae-button type="warm">暖色按钮</vae-button>

<vae-button type="danger">危险按钮</vae-button>

<vae-button type="info">信息按钮</vae-button>

Button组件属性参数