开头先BB两句
elementUI的表单组件，自带表单验证规则。虽然已经很方便了，但是我还是想封装一下。
通常用到的表单类型，主要包括：Radio 单选框，输入框，下拉框。
我封装了一个基础组件。把这些表单数据，放在一个json对象里面，传入封装好的基础组件。然后循环遍历，根据选项类型，展示输入框还是下拉框，等等。
项目中需要用到时，只需要安装，引入，配置json文件即可。
封装好的组件，放在项目中的components文件夹中，作为公共组件引入使用。
跟住，我又将整个基础表单的组件，发布到了npm上面。
封装组件并发布到npm
那么，如何将封装好的组件，发布到npm上呢？
第一步，新建一个vue项目，使用简洁的webapck配置模板，就可以了。
vue init webpack-simple my-project
第二步，在src文件夹下，新建一个components文件夹，放入封装好的BasicForm组件。
第三步，在根目录下新建一个index.js文件。
Vue的插件必须提供一个公开方法 install，该方法会在你使用该插件，也就是 Vue.use(yourPlugin)时被调用。这样也就给 Vue全局注入了你的所有的组件。
import basicForm from './src/components/basicForm/index.vue';
//注册组件
basicForm.install = Vue => Vue.component(basicForm.name, basicForm);
export default basicForm;
第四步，修改配置文件 webpack.config.js entry和output属性
entry: process.env.NODE_ENV == 'development' ? './src/main.js' : './index.js',
output: {path: path.resolve(__dirname, './dist'),publicPath: '/dist/',filename: 'basicForm.js',library: 'basicForm', // 指定的就是你使用require时的模块名libraryTarget: 'umd', // 指定输出格式umdNamedDefine: true // 会对 UMD 的构建过程中的 AMD 模块进行命名。否则就使用匿名的 define
},
第五步，修改 package.json 文件
//name就是发布后的包名
"name": "@orzr3/basic-form",
"private": false,
"main": "dist/basicForm.js",
第六步，提交发布
首先，要注册一个npm账号，官网链接在此：
传送门
PS
如果将镜像设置成了淘宝镜像，先设置回来，否则会报错
npm config set regis