#yi-frames-ui

The Mobile UI widgets of Yi-Frames

安装Yi-frames脚手架

First, 使用cnpm/npm/yarn 全局安装 Yeoman & generator-yi-frames.

cnpm i -g yo
cnpm i -g generator-yi-frames

Second,安装Yi-frames-js

• 同脚手架模板一起安装：下载脚手架模板到项目文件夹，自带yi-frames-ui模块：

yo yi-frames

* 单独安装
cnpm i --S yi-frames-app@版本号

[email protected]介绍

- 主框架： Layout
- 按钮：  Button
- 共用：Common
- Flex：Flex
- 浮动：Float
- 复选&单选：Checkbox／Radio
- 选择器：Select
- 输入框：Input
- 表单类：Forms
- 警告提示：Alert
- 吐司：Toast
- 对话框：Modal
- 标签页：Tabs
- 回到顶部：goTop
- 动画：Animation

使用说明

1、版本号
    - 下载下来脚手架后，在package.json里可查看yi-frames-app的版本

2、Pug
    - demo.pug内内容为相关配置文件，如下：
        extends ../node_modules/yi-frames-ui/m-widget/pug/layout.pug
        block pugConfig
	        -const pugConfig={titleText:`demoTitle`, cssName:`demoStyle`, confName:`demoJs`, isNotSpa:true, bodyClassName:['alert'], suffix:`.min`};
        block bodyContent
	        //- 内容编写区域，
    - layout已包含所有组件，如需组件可直接‘+name’即可使用，无需单独引用组件文件；
3、Sass
    - _mixin.scss为配置文件，可重定义组件样式，谨慎修改；
    - public.scss 为公用文件，已调用所有组件样式，如个别组件本需求暂无使用，建议注释掉，避免垃圾样式产生。
    - ‘_mixin.scss、layout.scss、common.scss’三个文件为所有项目依赖文件，必须调用；
    - 单页使用可直接调用相应组件样式，如下：@import "../../node_modules/yi-frames-ui/m-widget/scss/button.scss";

4、预览及调用方法
http://ep-svnserver30.tech.bitauto.com/FE/yi-widget/yi-wap-api/html/html/index.html

License

MIT © 贾时龙Mapk Volkov