Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Best workflow with grunt
Search
keelii
August 14, 2013
Programming
0
1k
Best workflow with grunt
基于 Grunt 构建最好的工作流
keelii
August 14, 2013
Tweet
Share
More Decks by keelii
See All by keelii
前端组件模块化思考与实践
keelii
4
1.1k
前端,改变 Front-end makes change
keelii
5
1k
前端开发工具
keelii
3
1.1k
Other Decks in Programming
See All in Programming
Django Ninja による API 開発効率化とリプレースの実践
kashewnuts
0
1.1k
明日から始めるリファクタリング
ryounasso
0
120
株式会社 Sun terras カンパニーデック
sunterras
0
250
(Extension DC 2025) Actor境界を越える技術
teamhimeh
1
240
育てるアーキテクチャ:戦い抜くPythonマイクロサービスの設計と進化戦略
fujidomoe
1
160
SpecKitでどこまでできる? コストはどれくらい?
leveragestech
0
610
Back to the Future: Let me tell you about the ACP protocol
terhechte
0
130
Catch Up: Go Style Guide Update
andpad
0
200
Web フロントエンドエンジニアに開かれる AI Agent プロダクト開発 - Vercel AI SDK を観察して AI Agent と仲良くなろう! #FEC余熱NIGHT
izumin5210
3
460
ソフトウェア設計の実践的な考え方
masuda220
PRO
3
510
The Flutter Journey of Building a Live Streaming App — With a Side of Performance Tuning
u503
1
100
CSC305 Lecture 02
javiergs
PRO
1
260
Featured
See All Featured
Build your cross-platform service in a week with App Engine
jlugia
232
18k
Optimizing for Happiness
mojombo
379
70k
Optimising Largest Contentful Paint
csswizardry
37
3.4k
Mobile First: as difficult as doing things right
swwweet
224
10k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Automating Front-end Workflow
addyosmani
1371
200k
How to train your dragon (web standard)
notwaldorf
96
6.3k
A Modern Web Designer's Workflow
chriscoyier
697
190k
How GitHub (no longer) Works
holman
315
140k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.2k
The Cult of Friendly URLs
andyhume
79
6.6k
The Straight Up "How To Draw Better" Workshop
denniskardys
237
140k
Transcript
Best workflow with Grunt 使用 Grunt 构建本地工作流 @keelii
目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •
开发目录
None
目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •
开发目录
开发工具 • 编辑器/IDE – sublime, Notepad++ • 调试工具 – Fiddler,
Developer Tools • 砖业工具 – Node.js, NPM (nodejs package manager) • 统筹自动化工具 – Grunt, yeoman, ant
The JavaScript Task Runner
Grunt 常用任务 • grunt-contrib-copy // 备份文件 • grunt-contrib-uglify // 压缩脚本
• grunt-contrib-cssmin // 压缩样式 • grunt-strip // 去除调试语句console • grunt-requirejs // 用于 requirejs 项目
• Gruntfile.js Grunt 执行配置文件,包括各种任务的参数 路径等 • package.json 项目信息,包括项目依赖的一些 Grunt 插件
版本等 Grunt 项目配置文件
Grunt 使用方法步骤 1. 安装 Node.js 「安装」 2. 撰写 package.json 与
Gruntfile.js 配置文件 3. 首次须安装依赖执行 npm install 安装依赖包 4. 切换到当前命令行路径执行 grunt 命令 附件 中提供了一个测试用的 grunt 相关配置文件,可根据情况修改使用
目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •
开发目录
Find and Run Robot2 Listary Todoist 程序快速启动器 ——妈妈再也不用担心我的桌面图标乱得一团糟了 本地文件/夹、目录快速访问、切换、查找 +
实用小工具 ——居家旅行躲猫猫必备神气 工作事项、待办事情(上线)管理工具。支持在线、客户端、手机等 —— 健忘症必备
目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •
开发目录
Macbook 更大的显示器 SSD固态硬盘 更多的内存 更好的键盘
目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •
开发目录
Subversion – 主流得像 jQuery 一样 Git – 开源、前端首选 CVS –
C/S架构软件版本控制系统 VSS – 微软出品 版本控制 版本比较 自动/手动备份 SVN diff, VIM diff SVN 自动备份版本,上线前半手动备份(grunt)
目录 • 开发工具 • 系统软件 • 硬件配置 • 版本管理 •
开发目录
Build app src vendor lib img doc assets dist test
目录命名 我的主干目录结构 build – 打包完上线用 app – 项目源码 - css - js - img test – 测试页面
END One more code … DAUX