yg-library
v0.3.3
Published
基于taro小程序开发的私有UI组件库
Downloads
28
Readme
yg-library
介绍
1、基于 taro+ts 框架的 ui 私有组件库;
2、所有组件和样式都由 yg 开头
3、组件都在 components 文件夹下,命名规范为组件名大写开头【具体相关事项如需请参考案例】,src/index.ts 为组件的统一暴露口,Yg + compName
4、组件的对应样式在 style/components 中,文件名命名与需与组件名对应
安装及使用
安装:npm install yg-library -s
样式
1、引用方式:app.scss 中引入全局样式 @import 'yg-library/styles';
2、变量:样式变量见 variable.scss,对应生成的 class 类名与其变量一致,开发中可使用类名【皮肤变量文件也可单独引入 @import "yg-library/variable"】
3、换肤:如需根据项目做皮肤替换,需注意的是在 app.scss 中 引用路径【@import 'yg-library/styles';】需要写在文件最后面才能覆盖默认的变量
4、常用样式见 style/css
5、如引用库的项目使用了webpack5,需要在config中配置,清除webpack5中对该库的cache,要不然在开发环境会出现部分原生标签找不到的情况(解决taro框架自带的bug)
compiler: {
type: 'webpack5',
prebundle: { exclude: ['yg-library'] }
},
使用示例
import { YgButton } from 'yg-library';
const Index = () => {
return (
<View>
<YgButton isFull onClick={_ => alert('我是按钮')}>
按钮
</YgButton>
</View>
)
}