ago008 / zarm

基于 React 的移动端UI库

Zarm UI

众安科技移动端UI组件库，基于React。（Vue版本传送门：zarm-vue）

Example 案例

Online example

Install 安装

npm install zarm --save

Import 引入

• 全组件引入

import { Button, Cell } from 'zarm';
import 'zarm/styles/index.scss';

• 单独引入

import Button from 'zarm/lib/Button';
import 'zarm/styles/core/index.scss';
import 'zarm/styles/variables.scss';
import 'zarm/styles/components/Button.scss';

• 也可以通过cdn引入umd模块

<link rel="stylesheet" href="https://unpkg.com/zarm@latest/dist/zarm.min.css">

<script src="https://unpkg.com/react-dom@16.0.0/umd/react.production.min.js" type="text/javascript"></script>
<script src="https://unpkg.com/react-dom@16.0.0/umd/react-dom.production.min.js" type="text/javascript"></script>
<script type="text/javascript" src="https://unpkg.com/zarm@latest/dist/zarm.min.js"></script>

Usage 使用

import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(<Button theme="primary">按钮</Button>, document.getElementById('app'));

注：使用以上方法需要支持jsx语法或者经过编译

Custom Theme 自定义主题

import { Button, Cell } from 'zarm';
import './styles/index.scss';

./style/index.scss 文件内容如下：

@import "node_modules/zarm/styles/core/index";
@import "node_modules/zarm/styles/variables";
@import "./variables";
@import "node_modules/zarm/styles/components";

通过自己的variables.scss文件重写sass变量。

Document 文档

中文

Changelog 更新日志

CHANGELOG.md

License

MIT