UNPKG

2.91 kBMarkdownView Raw
1<p style="background:#000;text-align:center;padding: 20px 0">
2<a href="https://matrix.58.com/)">
3 <img style="width: 46px;
4 height: 46px;display: inline-block;
5 vertical-align: middle;" src="https://matrix.58.com/home/dist/img/logo.gif"/>
6 <i style="font-size: 32px;
7 color: #fff;
8 display: inline-block;
9 vertical-align: middle;">MATRIX</i>
10</a>
11</p>
12
13[![Build Status][travis-image]][travis-url] [![license][license-image]][license-url] [![javascript style guide][standard-image]][standard-url] [![version][version-image]][version-url]
14
15[travis-url]: https://www.travis-ci.org
16[travis-image]: https://img.shields.io/badge/build-passing-brightgreen.svg
17[standard-image]: https://img.shields.io/badge/code_style-standard-brightgreen.svg
18[standard-url]: https://standardjs.com
19[license-image]: https://img.shields.io/badge/license-MIT-blue.svg
20[license-url]: demo/miniprogram-demo/LICENSE
21[version-image]: https://img.shields.io/badge/version-v0.0.9-blue.svg
22[version-url]: README.md
23
24> Better enable enterprise project in the background
25
26## Intro
27
28这是基于 [Vue](https://vuejs.org/) 的组件化实现,开发和服务于企业级产品,意旨在帮助开发者快速搭建属于自己的业务应用。
29
30
31
32## Install
33
34#### npm 安装
35> 推荐使用npm的方式安装,能更好的和`webpack`等打包工具配合使用
36``` bash
37npm install @bic-fe/mds-ui -S
38```
39
40#### CDN 引用
41> 支持在页面上引入`Js`和`Css`文件既可以开始使用
42
43```
44<!-- 引入样式 -->
45<link rel="stylesheet" href="https://unpkg.com/@bic-fe/mds-ui/dist/mds-ui.min.css">
46<!-- 引入组件库 -->
47<script src="https://unpkg.com/@bic-fe/mds-ui/dist/mds-ui.min.js"></script>
48
49```
50`注意`:使用`CDN`引入`mds-ui`组件库需要在链接地址上锁定版本,避免组件库升级的时候带来兼容性的影响。锁定版本的方法为在连接后面增加版本号
51
52目前可以通过 [unpkg.com/mds-ui](https://unpkg.com/browse/@bic-fe/mds-ui/) 获取到最新版本的资源,支持在页面上引入Js和Css文件既可以开始使用
53
54## Quick Start
55
56#### 完整引入
57
58```
59import Vue from 'vue'; // 引入Vue
60import '@bic-fe/mds-ui/dist/mds-ui.min.css'; // 引入组件的样式
61import MdsUi from '@bic-fe/mds-ui'; // 引入组件
62
63Vue.use(MdsUi); // 使用组件
64
65```
66
67#### 按需引入
68
69方法一:
70
71可以通过下面的写法来按需加载组件
72
73```
74import Button from '@bic-fe/mds-ui/dist/button';
75```
76方法二:
77
78也可以使用 babel-plugin-import 来进行按需加载
79
80```
81import { Button } from '@bic-fe/mds-ui';
82```
83`.babelrc`修改
84
85```
86{
87 "plugins": [
88 [
89 "import", {
90 "libraryName": "@bic-fe/mds-ui",
91 "libraryDirectory": "dist",
92 "styleLibraryDirectory": "dist/style",
93 "style":true
94 }
95 ]
96 ]
97}
98
99```
100## Browser Support
101
102Modern browsers and Internet Explorer 10+.
103
104## License
105
106[MIT](http://opensource.org/licenses/MIT)
\No newline at end of file