第一步
当前项目根目录新建文件 package.json 复制粘贴下面的代码
{
"name": "application-name",
"version": "0.0.1",
"devDependencies": {
"gulp": "^3.9.1",
"gulp-sass": "^2.2.0",
"gulp-uglify": "^1.5.3"
}
}
命令行输入
npm install
注意:这里推荐先全局安装 cnpm 镜像(淘宝 NPM 镜像)。
官方说明:这是一个完整 npmjs.org 镜像,你可以用此代替官方版本(只读),同步频率目前为 10分钟 一次以保证尽量与官方服务同步。
你可以使用 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm:
$ npm install -g cnpm –registry=https://registry.npm.taobao.org
从 registry.npm.taobao.org 安装所有模块. 当安装的时候发现安装的模块还没有同步过来, 淘宝 NPM 会自动在后台进行同步, 并且会让你从官方 NPM registry.npmjs.org 进行安装. 下次你再安装这个模块的时候, 就会直接从 淘宝 NPM 安装了.
$ cnpm install [name]
# 或者
$ cnpm install
下载好依赖的组件包( gulp、gulp-sass、gulp-uglify )
解释这个json:
name 是指你的项目名
version 当前项目的版本号
devDependencies 依赖的组件包
可以考虑在 json 中加入对应项目的仓库地址,方便其他伙伴查看下载
"repository": {
"type": "git",
"url": "git@github.com:orzhtml/orzhtml.github.com.git"
},
第二步
在项目的根目录新建一个说明文档 README.md 复制粘贴下面的代码
## TODO
//这里写接下来需要做的事情
## gulp 命令说明
gulp sass -编译sass
gulp uglify -压缩js
gulp default -默认任务并监听文件的变化自动执行任务
## 项目目录说明:
| git 过滤 | gulp 配置 | 包 配置 |
| ---------- | ----------- | ------------ |
| .gitingore | gulpfile.js | package.json |
| js源文件目录 | scss源文件目录 | 编译后的js目录 | 编译后的scss目录|
| ------------ | ------------ | ------------ | ------------ |
| js-build | scss | js | css |
就这样吧,去跟小伙伴愉快的合作开发吧
gulp 如何构建,请看上一篇:gulp-前端构建入门
本文内容均属个人原创作品,转载此文章须附上出处及原文链接。
加关注,定时推送,互动精彩多,若你有更好的见解,欢迎留言探讨!