Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/elemefe/mint-ui
Mobile UI elements for Vue.js
https://github.com/elemefe/mint-ui
component mobile ui-kit vue vue-components
Last synced: 5 days ago
JSON representation
Mobile UI elements for Vue.js
- Host: GitHub
- URL: https://github.com/elemefe/mint-ui
- Owner: ElemeFE
- License: mit
- Created: 2016-05-17T09:54:10.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2022-02-28T17:06:11.000Z (almost 3 years ago)
- Last Synced: 2024-12-09T21:42:29.075Z (12 days ago)
- Topics: component, mobile, ui-kit, vue, vue-components
- Language: Vue
- Homepage: http://mint-ui.github.io/#!/en
- Size: 3.26 MB
- Stars: 16,555
- Watchers: 474
- Forks: 3,554
- Open Issues: 292
-
Metadata Files:
- Readme: README.md
- Contributing: .github/CONTRIBUTING_en-us.md
- License: LICENSE
Awesome Lists containing this project
README
# Mint UI
[![Build Status](https://travis-ci.org/ElemeFE/mint-ui.svg?branch=master)](https://travis-ci.org/ElemeFE/mint-ui)
[![npm](https://img.shields.io/npm/v/mint-ui.svg?maxAge=3600)](https://www.npmjs.com/package/mint-ui)
[![NPM downloads](http://img.shields.io/npm/dm/mint-ui.svg)](https://npmjs.org/package/mint-ui)
![JS gzip size](http://img.badgesize.io/elemefe/mint-ui/master/lib/index.js.svg?compression=gzip&label=gzip%20size:%20JS)
![CSS gzip size](http://img.badgesize.io/elemefe/mint-ui/master/lib/style.css.svg?compression=gzip&label=gzip%20size:%20CSS)
[![Join the chat at https://gitter.im/ElemeFE/mint-ui](https://badges.gitter.im/ElemeFE/mint-ui.svg)](https://gitter.im/ElemeFE/mint-ui?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)> Mobile UI elements for **Vue 2.0**
- [Homepage](http://mint-ui.github.io)
- [Documentation](http://mint-ui.github.io/docs)## Installation
```shell
npm i mint-ui -S# for Vue 1.x
npm i mint-ui@1 -S
```## Usage
Import all components.
```javascript
import Vue from 'vue';
import Mint from 'mint-ui';
import 'mint-ui/lib/style.css';Vue.use(Mint);
```Or import specified component. (Use [babel-plugin-component](https://www.npmjs.com/package/babel-plugin-component))
```javascript
import { Cell, Checklist } from 'mint-ui';Vue.component(Cell.name, Cell);
Vue.component(Checklist.name, Checklist);
```Equals to
```javascript
import Vue from 'vue';
import Mint from 'mint-ui';
import 'mint-ui/lib/style.css';Vue.use(Mint);
// import specified component
import MtRadio from 'mint-ui/lib/radio';
import 'mint-ui/lib/radio/style.css';Vue.component(MtRadio.name, MtRadio);
```## babel-plugin-component
- Auto import css file
- Modular import componentInstallation
```shell
npm i babel-plugin-component -D
```Usage
.babelrc
```json
{
"plugins": ["other-plugin", ["component", [
{ "libraryName": "mint-ui", "style": true }
]]]
}
```## CDN
RawGit- https://cdn.rawgit.com/ElemeFE/mint-ui/master/lib/index.js
- https://cdn.rawgit.com/ElemeFE/mint-ui/master/lib/style.cssNPMCDN
- https://unpkg.com/mint-ui/lib/index.js
- https://unpkg.com/mint-ui/lib/style.css## Development
```shell
npm run dev
```## Contribution
Please make sure to read the [Contributing Guide](https://github.com/ElemeFE/mint-ui/blob/master/.github/CONTRIBUTING_en-us.md) before making a pull request.## License
MIT