Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Best workflow with grunt

keelii
August 14, 2013

Best workflow with grunt

基于 Grunt 构建最好的工作流

keelii

August 14, 2013
Tweet

More Decks by keelii

Other Decks in Programming

Transcript

  1. Best workflow with Grunt 使用 Grunt 构建本地工作流 @keelii

  2. 目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •

    开发目录
  3. None
  4. 目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •

    开发目录
  5. 开发工具 • 编辑器/IDE – sublime, Notepad++ • 调试工具 – Fiddler,

    Developer Tools • 砖业工具 – Node.js, NPM (nodejs package manager) • 统筹自动化工具 – Grunt, yeoman, ant
  6. The JavaScript Task Runner

  7. Grunt 常用任务 • grunt-contrib-copy // 备份文件 • grunt-contrib-uglify // 压缩脚本

    • grunt-contrib-cssmin // 压缩样式 • grunt-strip // 去除调试语句console • grunt-requirejs // 用于 requirejs 项目
  8. • Gruntfile.js Grunt 执行配置文件,包括各种任务的参数 路径等 • package.json 项目信息,包括项目依赖的一些 Grunt 插件

    版本等 Grunt 项目配置文件
  9. Grunt 使用方法步骤 1. 安装 Node.js 「安装」 2. 撰写 package.json 与

    Gruntfile.js 配置文件 3. 首次须安装依赖执行 npm install 安装依赖包 4. 切换到当前命令行路径执行 grunt 命令 附件 中提供了一个测试用的 grunt 相关配置文件,可根据情况修改使用
  10. 目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •

    开发目录
  11. Find and Run Robot2 Listary Todoist 程序快速启动器 ——妈妈再也不用担心我的桌面图标乱得一团糟了 本地文件/夹、目录快速访问、切换、查找 +

    实用小工具 ——居家旅行躲猫猫必备神气 工作事项、待办事情(上线)管理工具。支持在线、客户端、手机等 —— 健忘症必备
  12. 目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •

    开发目录
  13. Macbook 更大的显示器 SSD固态硬盘 更多的内存 更好的键盘

  14. 目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •

    开发目录
  15. Subversion – 主流得像 jQuery 一样 Git – 开源、前端首选 CVS –

    C/S架构软件版本控制系统 VSS – 微软出品 版本控制 版本比较 自动/手动备份 SVN diff, VIM diff SVN 自动备份版本,上线前半手动备份(grunt)
  16. 目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •

    开发目录
  17. Build app src vendor lib img doc assets dist test

    目录命名 我的主干目录结构 build – 打包完上线用 app – 项目源码 - css - js - img test – 测试页面
  18. END One more code … DAUX