当前仓库属于关闭状态,部分功能使用受限,详情请查阅 仓库状态说明
8 Star 31 Fork 19

浙江易网科技股份有限公司 / gulp-automation
关闭

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README

gulp-automation

利用 Gulp 配置的前端项目自动化工作流,实现 css js html 代码和图片一键压缩、发布、打包、上线。


使用

本项目基于 Gulp 4.x 运行,如果你以前全局安装过 gulp ,需要先运行 npm rm --global gulp 删除旧版本 gulp ,再运行 npm install --global gulp-cli 安装最新版本。

方法 1

适用于初学者快速上手,项目里包含演示文件,方便学习

拉取该项目到本地,修改 package.json 文件里的 name 参数为项目名,然后依次运行:

npm install
gulp

访问 http://localhost:3000 即可看到页面。

方法 2

适用于熟练使用的老手,项目里无演代码,方便开发工作

使用易网项目手脚架 1one-project 进行项目初始化,随后运行:

$ gulp

访问 http://localhost:3000 即可看到页面。

指令

运行指令

gulp

发布指令

gulp build

tinypng 的压缩效果比 imagemin 更显著 如果使用 tinypng 进行图片压缩,请确保打包时网络畅通

说明

目录结构

gulp-automation
  ├─ build                发布目录,发布时会将 css js html 文件进行压缩,并存放于此
  ├─ build-zip            打包目录,每次发布都会生成一个 zip 压缩包存放于此
  ├─ page                 静态页面
  │  └─ include           公用页面
  ├─ static               资源文件
  │  ├─ css               css 文件,通过 sass 自动生成
  │  ├─ image             图片文件
  │  │  └─ sprite         精灵图存放目录
  │  ├─ js                js 文件,通过 sourcejs 自动生成
  │  ├─ plugin            plugin 文件,存放 js 或 css 的插件和框架
  │  ├─ sass              sass 源文件
  │  ├─ sourcejs          js 源文件
  │  └─ template          template 文件,存放 js 模版文件
  ├─ config.json          项目配置文件
  ├─ gulpfile.js          gulp 配置文件
  └─ package.json         npm 配置文件

项目配置

config.json 将业务代码里,会因为环境不同而变化的数据进行统一配置,常见的有网站标题、接口地址等。

默认配置提供了两套环境,分别为开发环境和生产环境,可根据业务需求自行增加,例如增加测试环境。

"development": {          // 名称,唯一
    "name": "开发环境",    // 名称,用于图形化界面的展示
    "data": {             // 需要用到的数据
        "title": "开发",
        "api": "https://api.douban.com/v2/",
        "local": true
    }
}

该功能基于 gulp-preprocess 实现

功能模块

IDE(编辑器)

推荐使用 VS Code ,并安装以下扩展:

相关阅读

空文件

简介

利用 Gulp 配置的前端自动化工作流 展开 收起
JavaScript 等 3 种语言
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
JavaScript
1
https://gitee.com/eoner/gulp-automation.git
git@gitee.com:eoner/gulp-automation.git
eoner
gulp-automation
gulp-automation
master

搜索帮助

14c37bed 8189591 565d56ea 8189591