分享一些自己写的前端库,并骗骗 star(库都是在实际项目中大量运用过的)
最近一两年在一些项目上,通过实际需求出发,编写了一些库在项目中使用,现在将这些项目都稍微整理了一下开源了出来,也许也有刚好能够你也用得上的,顺便也骗一下star。均在项目的README
中加了相关的说明。
迷你全功能的模板引擎(压缩版代码不到2kb)
项目地址: https://github.com/coffeedeveloper/coffee-tmpl
npm包名: coffee-tmpl
语法和ejs
保持一致,只不过这个模板引擎只能用到浏览器,不支持layout
之类的高级用法。会写这个库是因为很多情况下,我需要做一些小型到中型的模板输出,而我觉得市面上大部分的模板引擎都太大太负责了,这个库的迷你以及支持原生的js语句,能够覆盖大部分使用场景了。
可配置的抽奖转盘模板
项目地址: https://github.com/coffeedeveloper/turntable
npm包名: lottery-turntable
之前做抽奖活动的时候发现市面上基本上转盘的抽奖都是采用一张背景图片去做transition
,满足不了动态增删改奖品这样的灵活运营需求,特意写了一个支持两种动画类型(transition / requestAnimationFrame)的。是采用svg绘出整个转盘,主要用于手机端方面的活动。
将js数组导出成CSV文件(解决了中文编码的问题)
项目地址: https://github.com/coffeedeveloper/exportjs
npm包名: exportjs
在做管理后台的时候,需要将一些表格的数据导出,以前都是让服务端开发单独的一个报表导出接口。可是考虑到一些简单的情景,可以通过遍历列表接口,然后汇总后前端自己做报表的生成导出即可。这个库解决了类似中文编码之类的问题。在只针对管理后台的情况下是能够直接运用的(我们只限制使用人员用chrome),因此不需要过多的考虑兼容性的问题。
功能完善的滚动加载库
项目地址: https://github.com/coffeedeveloper/loadmaster
npm包名: loadmaster
当你页面需要滚动加载以及做当前模块曝光埋点,以及图片延迟加载的时候,采用这个库就能够很好的完成。会自动检测你的当前曝光模块、即将加载的模块、已经离开的模块,即将到底部的检测。可以通过在事件触发的时候完成对应的处理,还是相当方便的。
一个很简易的事件监听触发库
项目地址: https://github.com/coffeedeveloper/coffee-eventemitter
npm包名: coffee-eventemitter
主要是在某些场景下(例如: 通知数据变化之类的store事件),需要用到自定义的事件触发时,可以很方面的套用过来。支持on\once\off\emit
娱乐性的打字效果库
项目地址: https://github.com/coffeedeveloper/typing.js
npm包名: typing.js
之前写的娱乐性库,曾经也宣传过一次,可以通过demo来看下效果。 demo
总结
这些库都是在实际的生产环境项目上跑过的,大的bug可以说是都没有的。当然可能在某些极端情况下的场景没有照料到,如果你发现了bug,可以给我提issue
我会抽空修复的。当然最后如果你觉得这些苦能够在项目上帮助到你,也不妨帮忙点个star,激励一下我_