帮酷LOGO
  • 显示原文与译文双语对照的内容
基于React.js的移动端UI库

  • 源代码名称:zarm
  • 源代码网址:http://www.github.com/ZhonganTechENG/zarm
  • zarm源代码文档
  • zarm源代码下载
  • Git URL:
    git://www.github.com/ZhonganTechENG/zarm.git
  • Git Clone代码到本地:
    git clone http://www.github.com/ZhonganTechENG/zarm
  • Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/ZhonganTechENG/zarm
    Checked out revision 1.
    $ cd repo
    $ svn up trunk
  • Zarm UI

    Build StatusCoverage Statusnpm packageNPM downloadsJS gzip sizeCSS gzip size

    众安科技移动端UI组件库,基于React。

    Install 安装

    使用npm安装:

    npm install zarm --save

    或者通过cdn引入umd模块:

    <linkrel="stylesheet"href="https://unpkg.com/zarm@latest/dist/zarm.min.css">
    <scripttype="text/javascript"src="https://unpkg.com/zarm@latest/dist/zarm.min.js"></script>

    Usage 使用

    全组件引入
    import { Button, Cell } from'zarm';import'zarm/dist/zarm.min.css';
    按需加载
    • 方法一(推荐)

    使用 babel-plugin-import 自动加载Sass文件

    // .babelrc or babel-loader option  {
        "plugins": [
          ['import', {
            libraryName:'zarm',
            style:true,
            camel2DashComponentName:false,
          }],
        ]
      }
    import { Button, Cell } from'zarm';
    • 方法二:
    importButtonfrom'zarm/lib/Button';import'zarm/lib/Button/style';
    定制主题

    通过覆盖Sass变量定义达到定制主题的效果

    @import"~zarm/lib/style/index.scss";  // 引入官方提供的Sass基础样式文件@import"your-theme-file.scss";  // 用于覆盖上面定义的变量@import"~zarm/lib/style/components.scss";  // 引入官方提供的组件样式文件

    your-theme-file.scss 示例如下:

    $theme-primary: #108ee9;

    变量名可参考 default.scss

    注意:这种方式已经载入了所有组件的样式,不需要也无法和按需加载插件 babel-plugin-importstyle 属性一起使用。

    Document 文档

    中文

    Changelog 更新日志

    CHANGELOG.md

    License

    MIT




    Copyright © 2011 HelpLib All rights reserved.    知识分享协议 京ICP备05059198号-3  |  如果智培  |  酷兔英语