gulp-rev 项目使用教程
1. 项目的目录结构及介绍
gulp-rev 项目的目录结构如下:
gulp-rev/
├── examples/
│ └── basic/
│ ├── gulpfile.js
│ ├── package.json
│ └── src/
├── lib/
│ ├── index.js
│ └── manifest.js
├── node_modules/
├── test/
│ ├── index.js
│ └── manifest.js
├── .editorconfig
├── .eslintrc
├── .gitattributes
├── .gitignore
├── .npmignore
├── .travis.yml
├── gulpfile.js
├── index.js
├── license
├── package.json
└── readme.md
目录介绍
examples/
: 包含一些示例项目,展示如何使用 gulp-rev。lib/
: 包含 gulp-rev 的核心代码。node_modules/
: 存放项目依赖的第三方模块。test/
: 包含项目的测试文件。.editorconfig
,.eslintrc
,.gitattributes
,.gitignore
,.npmignore
,.travis.yml
: 项目配置文件。gulpfile.js
: 项目的 gulp 配置文件。index.js
: 项目的入口文件。license
: 项目的许可证文件。package.json
: 项目的 npm 配置文件。readme.md
: 项目的说明文档。
2. 项目的启动文件介绍
项目的启动文件是 gulpfile.js
,它定义了如何使用 gulp-rev 插件来处理静态文件。以下是一个基本的 gulpfile.js
示例:
const gulp = require('gulp');
const rev = require('gulp-rev');
gulp.task('default', () => {
return gulp.src('src/*.css')
.pipe(rev())
.pipe(gulp.dest('dist'))
.pipe(rev.manifest())
.pipe(gulp.dest('dist'));
});
启动文件介绍
gulp.task('default', ...)
: 定义了一个默认任务,当运行gulp
命令时会执行这个任务。gulp.src('src/*.css')
: 选择src
目录下的所有 CSS 文件。pipe(rev())
: 使用 gulp-rev 插件为这些文件添加 hash 后缀。pipe(gulp.dest('dist'))
: 将处理后的文件输出到dist
目录。pipe(rev.manifest())
: 生成一个 manifest 文件,记录原始文件名和添加 hash 后文件名的映射关系。pipe(gulp.dest('dist'))
: 将 manifest 文件输出到dist
目录。
3. 项目的配置文件介绍
项目的配置文件主要包括 package.json
和 gulpfile.js
。
package.json
package.json
文件包含了项目的元数据和依赖信息。以下是一个简化的示例:
{
"name": "gulp-rev",
"version": "9.0.0",
"description": "Static asset revisioning by appending content hash to filenames: unicorn.css => unicorn-d41d8cd98f.css",
"main": "index.js",
"scripts": {
"test": "xo && ava"
},
"keywords": [
"gulpplugin",
"rev",
"revision",
"hash",
"optimize",
"version",
"versioning",
"cache",
"expire",
"static",
"asset",
"assets",
"web"
],
"author": "Sindre Sorhus <sindresorhus@gmail.com> (sindresorhus.com)",
"license": "MIT",
"dependencies": {
"gulp-util": "^3.0.8",
"through2": "^2.0.3",
"rev-hash": "^3.0.0",
"rev-path": "^2.0.0",
"vinyl-file": "^3.0.0",
"vinyl-paths": "^3.0.0",
"write-json-file": "^3