# 每個文件夾生成單獨一個文件
如果你有一整套的文件目錄,并且希望執行相應的一套任務,比如...
```
/scripts
/scripts/jquery/*.js
/scripts/angularjs/*.js
```
...然后希望完成如下的結果h...
```
/scripts
/scripts/jquery.min.js
/scripts/angularjs.min.js
```
...你將會需要像下面所示的東西...
```
var fs = require('fs');
var path = require('path');
var merge = require('merge-stream');
var gulp = require('gulp');
var concat = require('gulp-concat');
var rename = require('gulp-rename');
var uglify = require('gulp-uglify');
var scriptsPath = 'src/scripts';
function getFolders(dir) {
return fs.readdirSync(dir)
.filter(function(file) {
return fs.statSync(path.join(dir, file)).isDirectory();
});
}
gulp.task('scripts', function() {
var folders = getFolders(scriptsPath);
var tasks = folders.map(function(folder) {
// 拼接成 foldername.js
// 寫入輸出
// 壓縮
// 重命名為 folder.min.js
// 再一次寫入輸出
return gulp.src(path.join(scriptsPath, folder, '/*.js'))
.pipe(concat(folder + '.js'))
.pipe(gulp.dest(scriptsPath))
.pipe(uglify())
.pipe(rename(folder + '.min.js'))
.pipe(gulp.dest(scriptsPath));
});
return merge(tasks);
});
```
注:
* `folders.map` - 在每一個文件夾中分別執行一次函數,并且返回異步 stream
* `merge` - 匯總 stream,并且在所有的 stream 都完成后完成
- gulp 中文文檔
- 入門指南
- gulp API 文檔
- 編寫插件
- 指導
- 使用 buffer
- 使用 Stream 處理
- 測試
- FAQ
- gulp 技巧集
- 整合 streams 來處理錯誤
- 刪除文件和文件夾
- 使用 watchify 加速 browserify 編譯
- 增量編譯打包,包括處理整所涉及的所有文件
- 將 buffer 變為 stream (內存中的內容)
- 在 gulp 中運行 Mocha 測試
- 僅僅傳遞更改過的文件
- 從命令行傳遞參數
- 只重新編譯被更改過的文件
- 每個文件夾生成單獨一個文件
- 串行方式運行任務,亦即,任務依賴
- 擁有實時重載(live-reloading)和 CSS 注入的服務器
- 通過 stream 工廠來共享 stream
- 指定一個新的 cwd (當前工作目錄)
- 分離任務到多個文件中
- 使用外部配置文件
- 在一個任務中使用多個文件來源
- Browserify + Uglify2 和 sourcemaps
- Browserify + Globs
- 同時輸出一個壓縮過和一個未壓縮版本的文件
- 改變版本號以及創建一個 git tag
- Swig 以及 YAML front-matter 模板