@vhim/vhim v0.1.1

title: 快速开始

警告

这是一个实验性质的作品，主要用来作为我自己技术探索的一部分，
目前由我一人开发、维护，1.0 版本之前请勿用于生产环境（建议优先选择市面上成熟的移动端 UI 组件库，如：vant、cube-ui、mint-ui、vux）。
(查看当前版本请移步 package.json)

项目特点：

• 基于 Vue CLI 3.x；
• 使用 TypeScript 类声明方式;
• 丰富的单元测试；
• 使用 Travis CI 进行持续集成；

欢迎 Star，欢迎 Fork~

Vhim

基于 Vue.js 和 WeUI.css 的移动端 UI 组件库，不仅实现了微信官方样式库（WeUI.css）的全部 CSS 组件，还提供了大量额外的拓展组件和实用工具库，非常适合微信公众号等移动端应用开发。

名字由来

一首歌的歌名：你说喂（V）我说嗨（Hi），
然后，这是一套移动端（M）的 UI 组件库。

特性

• 基于 Vue.js 和 微信官方样式库 WeUI.css
• 完善的文档示例
• 支持按需加载
• 支持服务端渲染（Vue SSR）

安装

1）安装 WeUI

Vhim 中的组件与 CSS 完全解绑，所以在安装 Vhim 前，您需要先引入 WeUI。

CDN

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/weui@v2.1.2" />

提示
我们建议您直接复制上面这段代码，以免出现不兼容的情况。

2）安装 Vhim

npm i @vhim/vhim -S

引入

您可以引入整个 Vhim，也可以根据需要仅引入部分组件。

• 引入整个组件库

import Vue from 'vue';
import Vhim from '@vhim/vhim';
import App from './App.vue';

Vue.use(Vhim);

new Vue({
  el: '#app',
  render: h => h(App),
});

• 按需引用组件
  如果您只希望引入部分组件，比如 Button，那么需要在 main.js 中写入以下内容：

import Vue from 'vue';
import Button from '@vhim/vhim/lib/button/Button.umd.min.js';
import App from './App.vue';

Vue.use(Button);

new Vue({
  el: '#app',
  render: h => h(App),
});

提示
查看完整组件列表请移步 components.json

使用

至此，Vhim 的准备工作已全部完成，现在就可以编写代码了。
各个组件的使用方法请查看它们各自的文档。

链接

• 更新日志
• 案例征集

• Vhim
• Vue
• WeUI
• WeUI Design

• 联系我们：contact@liuhelin.com

开源协议

The MIT License
请自由地享受和参与开源

贡献

如果您在使用 Vhim 时遇到问题，或者有好的建议，欢迎给我们提 Issue 或 Pull Request。