亲手用模块化方式写一个jquery QQ表情插件。

在回复或是评论的时候,很多时间都需要有回复表情的功能,然后而需要插入QQ表情可以是最常见的。

插件也写多很多个了,这次写插件就下了一个决定。就是使用模块化来开发。

最后在我的源代码中有这样子一段:

var css = require('./css.css'); //创建css
var arr = require('./facemap.js'); //返回表情数组
var insertText = require('./insertText.js'); //负责向textarea插入字符串
var position = require('./position.js'); //根据按钮显示div的位置
var creatFace = require('./creatFace.js'); //传入arr 和图片路径 返回html字符串

可以很清楚的看到。把这些能独立出去的都用模块化了。

主要用到的知识点:
1.模块化:采用node的方式module.exports
2.gulp来进行构建
3.webpack的loader的使用,将css也当成了插件的一个模块。

代码地址:https://github.com/kyo4311/jquery.qqface
在线示例:http://kyo4311.github.io/jquery.qqface/

当然,这只是我自己用来学习的一个项目,没有经过测试,可能会存在一些问题,
如果有同学以后用在实际项目了,并发现了什么问题,可以在https://github.com/kyo4311/jquery.qqface/issues留言。

posted @ 2016-03-09 13:42  本相  阅读(584)  评论(2编辑  收藏  举报