tinytool

基于gulp、requirejs、zepto、stylus、ejs。

开发使用

• 需要在项目的package.json配置：

"config": {
  "port": 你的端口号,
  "namespace": 你的namespace,
  "host": "feresource.com"
}

• npm install tinytool --registry=https://registry.npm.taobao.org

• nohup tinytooldev connect &（只在首次，之后Server服务就一直后台运行，除非异常或关机）

• 编译出压缩后代码，使用NODE_ENV=production tinytool css

• 编译出未格式化代码，使用tinytool css

• 如果发现修改文件不生效，可以ctrl+C退出之后使用tinytool watch

• 如果发现修改文件不生效，可以ctrl+C退出之后使用tinytool watch

• 如果希望编译出压缩后代码，可以ctrl+C退出之后使用NODE_ENV=production tinytool watch

• 如果希望只watch css代码，可以ctrl+C退出之后使用tinytool watchcss

• 如果希望图片压缩（只针对.jpg、.png结尾图片压缩），可以使用tinytooldev tinyimg，然后到dist/[你的namespace]/src/resourcetinyimg目录下找到对应图片，然后替换原有图片

• 本地需要绑定host：127.0.0.1 feresource.com

• 访问地址：http://feresource.com:[你的端口号]/[你的namespace] （如果服务访问不了端口被占用，可参考小技巧）

• 在页面中添加可使用livereload模式：<script src="http://feresource.com:[你的端口号]/[你的namespace]/third/livereload.js"></script>

小技巧

• 检查端口占用：lsof -i :[你的端口号]
• kill对应进城：kill -9 PID

构建工具功能：

• 本地Server，支持实时编译资源 done
• 支持amd，模块加载方案，异步，同步 done
• 支持stylus解析 done
• 支持资源（js，css）压缩，嵌套，合并 done
• 支持ejs和html的require到js里面 done
• 支持require json文件到js里面 done
• gulp watch编译报错时不再影响下一次watch done
• 支持npm run方式图片压缩 done
• 支持接口mock done
• 支持代码检查eslint done
• 支持实时编译时通过参数查看压缩后代码 done
• 如果build编译报错，停止编译，watch模式除外 done
• 支持增量编译 done
• 支持可选的实时刷新 done
• 支持编译报错提醒 done
• 支持背景图版本加后缀自动更新 done
• 支持html公共部分include（gulp-file-include）
• 图片压缩使用gulp-imagemin，现在速度太慢 done
• 以下为低优先级
• 报错系统提醒
• 支持自动添加define头和尾（gulp-header\gulp-footer）
• 实时刷新替换为socket模式，gulp connect的方式似乎有问题
• 支持source map
• 支持资源生成base 64（图片等）
• 支持单元测试
• 支持生成文档（jsdoc）

---

---

常用gulp插件

• https://www.jianshu.com/p/df65ae89b862
• gulp-rev，根据静态资源内容，生成md5签名，打包出来的文件名会加上md5签名，同时生成一个json用来保存文件名路径对应关系。
• gulp-stylint，linter for stylus
• EJS-Lint，缺失gulp相关插件
• gulp-notify，报错系统提醒