搭建组件私有仓库

Git仓库当私有npm

我们通常通过 npm 来安装和使用开源的库。
但是，通常我们有些私有的模块，更新不频繁，不想通过npm发布，但是又想在多个项目中使用，同时我们不想将组件库复制到各个项目中来使用。而且一旦公有模块更新，我们也不能及时更新。

利用现有的git，既不用搭建私有的npm私有仓库，又能满足上面的需求，它做为一个快速解决方案, 后期是可以慢慢过渡升级到使用完整 npm 私有仓库
项目地址：http://[ip]/wonders-ui

私有组件库搭建

安装

"@wonders-ui/mobile": "git+http://[ip]/wonders-ui/mobile.git"

使用

import Vue from 'vue'
import wondersUI from '@wonders-ui/mobile'

Vue.use(wondersUI)

注意

不好的地方是，使用 npm update / yarn 是无法更新这个@wonders-ui/mobile”，想更新只能重新安装一次，或者使用下面命令。

yarn add git+http://[ip]:[password]@[ip]/wonders-ui/mobile.git

管理组件库

@wonders-ui/web使用storybook来管理组件库

简述

1. 可以帮助构建 UI 组件，组合组件，说明文档，测试和部署 UI 组件的工具，与业务功能隔离开来，专注于开发组件。
2. 支持框架 React，Vue等
3. 提供丰富的插件供开发使用，比如docs可以生产组件参数说明（参数描述，参数定义，支持的类型等）， knobs 帮助您在隔离构建UI组件时 可以动态地修改组件的参数来验证交互; notes可以展示你的md文档； addon-storysource可以直接在页面看到你的源码；一键生成所有截图的Storybook Chrome Screenshot Addon。这些社区的addons都非常实用。感兴趣可以自己增加
4. 支持模拟不同设备下的组件
5. jest自动化测试组件还有依靠视觉,快照和视觉回归测试
6. 灵活度很高，如果想使用js/ts，css,/scss/styled-components, redux 都是可以的，在其他组件库基础上进行二次开发，需要自行配置项目

运行

• git clone
• yarn
• yarn storybook