Как скопировать папку с помощью Gulp

Введение

Копирование директорий это очень популярная задача для Gulp. Обычно, директории копируются не полностью, а выборочно, например из app и temp выбирают только файлы нужные для приложения и копируют в distr , но для знакомства с Gulp можно начать с простого копирования и усложнять задачу по мере надобности.

Копируем

Скопируем папку app в dest вместе со всеми вложениями.

В gulpfile.js добавим следующее задание.

gulp.task('deploy2', function() { return gulp.src('app/**/*.*') .pipe(gulp.dest('dest') ); } );

$ gulp deploy

[14:50:36] Using gulpfile ~\Desktop\Sites\heihei\gulpfile.js
[14:50:36] Starting 'deploy2'...
[14:50:36] Finished 'deploy2' after 46 ms

Файлы успешно скопировались, но что если мы хотим узнать какие именно файлы были скопированы

вызовем .on

gulp.task('deploy2', function() { console.log("deploy task is running!"); return gulp.src('app/**/*.*') .on('data', function(file){ console.log(file) }) .pipe(gulp.dest('dest') ); } );

$ gulp deploy

[14:39:14] Using gulpfile ~\Desktop\Sites\heihei\gulpfile.js
[14:39:14] Starting 'deploy'...
deploy task is running!
<File "index.html" <Buffer 0d 0a 0d 0a 3c 21 2d 2d 20 30 31 30 5f 63 73 73 5f 69 6e 63 20 2d 2d 3e 0d 0a 3c 21 44 4f 43 54 59 50 45 20 68 74 6d 6c 3e 0d 0a 3c 68 74 6d 6c 20 6c ... >>
<File "temp\styles\style.css" <Buffer 2f 2a 21 20 6e 6f 72 6d 61 6c 69 7a 65 2e 63 73 73 20 76 38 2e 30 2e 31 20 7c 20 4d 49 54 20 4c 69 63 65 6e 73 65 20 7c 20 67 69 74 68 75 62 2e 63 6f ... >>
<File "assets\styles\style.css" <Buffer 40 69 6d 70 6f 72 74 20 22 6e 6f 72 6d 61 6c 69 7a 65 2e 63 73 73 22 3b 0d 0a 40 69 6d 70 6f 72 74 20 22 62 61 73 65 2f 5f 67 6c 6f 62 61 6c 22 3b 0d ... >>
<File "assets\styles\base\_global.css" <Buffer 68 74 6d 6c 2c 20 62 6f 64 79 20 7b 70 61 64 64 69 6e 67 3a 30 3b 20 6d 61 72 67 69 6e 3a 30 3b 7d>>
<File "assets\styles\modules\_finnish_colors.css" <Buffer 2f 2a 20 48 65 69 48 65 69 2e 72 75 20 46 69 6e 6c 61 6e 64 20 2a 2f 0d 0a 2f 2a 20 24 66 69 6e 42 6c 75 65 3b 20 2d 20 66 69 6e 6e 69 73 68 20 66 6c ... >>
<File "assets\styles\modules\_general.css" <Buffer 68 74 6d 6c 2c 20 62 6f 64 79 20 7b 70 61 64 64 69 6e 67 3a 30 3b 20 6d 61 72 67 69 6e 3a 30 3b 7d>>
<File "assets\styles\modules\_topmenu-old.css" <Buffer 2f 2a 20 48 65 69 48 65 69 2e 72 75 20 46 69 6e 6c 61 6e 64 20 2a 2f 0d 0a 2f 2a 20 23 39 45 31 42 33 34 20 d1 8f d1 80 d0 ba d0 be 2d d0 ba d1 80 d0 ... >>
<File "assets\styles\modules\_topmenu.css" <Buffer 23 6d 65 6e 75 2c 20 23 73 74 61 74 69 63 30 31 20 2c 20 23 73 74 61 74 69 63 30 32 2c 0d 0a 23 73 74 61 74 69 63 30 33 20 2c 23 73 74 61 74 69 63 30 ... >>
<File "assets\styles\modules\_variables.css" <Buffer 24 66 69 6e 42 6c 75 65 3a 20 23 30 30 32 66 36 63 3b 20>>
[14:39:14] Finished 'deploy2' after 81 ms

Разберём более детально, что происходит с файлами во время копирования.

Добавим деталей в console.log

gulp.task('deploy2', function() { console.log("deploy task is running!"); return gulp.src('app/**/*.*') .on('data', function(file){ console.log({ contents: file.contents, path: file.path, cwd: file.cwd, base: file.base, // path component helpers relative: file.relative, dirname: file.dirname, basename: file.basename, stem: file.stem, extname: file.extname }); }) .pipe(gulp.dest('dest') ); } );

$ gulp deploy

[15:19:05] Using gulpfile ~\Desktop\Sites\heihei\gulpfile.js
[15:19:05] Starting 'deploy2'...
deploy2 task is running!
{ contents:
<Buffer 0d 0a 0d 0a 3c 21 2d 2d 20 30 31 30 5f 63 73 73 5f 69 6e 63 20 2d 2d 3e 0d 0a 3c 21 44 4f 43 54 59 50 45 20 68 74 6d 6c 3e 0d 0a 3c 68 74 6d 6c 20 6c ... >,
path:
'C:\\Users\ao\Desktop\Sites\heihei
\app\index.html',
cwd: 'C:\\Users\ao\Desktop\Sites\heihei',
base: 'C:\\Users\ao\Desktop\Sites\heihei\app',
relative: 'index.html',
dirname: 'C:\\Users\ao\Desktop\Sites\heihei\app',
basename: 'index.html',
stem: 'index',
extname: '.html' }
{ contents:
<Buffer 40 69 6d 70 6f 72 74 20 22 6e 6f 72 6d 61 6c 69 7a 65 2e 63 73 73 22 3b 0d 0a 40 69 6d 70 6f 72 74 20 22 62 61 73 65 2f 5f 67 6c 6f 62 61 6c 22 3b 0d ... >,
path:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\style.css',
cwd: 'C:\\Users\ao\Desktop\Sites\heihei',
base: 'C:\\Users\ao\Desktop\Sites\heihei\app',
relative: 'assets\styles\style.css',
dirname:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles',
basename: 'style.css',
stem: 'style',
extname: '.css' }
{ contents:
<Buffer 2f 2a 21 20 6e 6f 72 6d 61 6c 69 7a 65 2e 63 73 73 20 76 38 2e 30 2e 31 20 7c 20 4d 49 54 20 4c 69 63 65 6e 73 65 20 7c 20 67 69 74 68 75 62 2e 63 6f ... >,
path:
'C:\\Users\ao\Desktop\Sites\heihei
\app\temp\styles\style.css',
cwd: 'C:\\Users\ao\Desktop\Sites\heihei',
base: 'C:\\Users\ao\Desktop\Sites\heihei\app',
relative: 'temp\styles\style.css',
dirname:
'C:\\Users\ao\Desktop\Sites\heihei
\app\temp\styles',
basename: 'style.css',
stem: 'style',
extname: '.css' }
{ contents:
<Buffer 68 74 6d 6c 2c 20 62 6f 64 79 20 7b 70 61 64 64 69 6e 67 3a 30 3b 20 6d 61 72 67 69 6e 3a 30 3b 7d>,
path:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\base\_global.css',
cwd: 'C:\\Users\ao\Desktop\Sites\heihei',
base: 'C:\\Users\ao\Desktop\Sites\heihei\app',
relative: 'assets\styles\base\_global.css',
dirname:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\base',
basename: '_global.css',
stem: '_global',
extname: '.css' }
{ contents:
<Buffer 2f 2a 20 48 65 69 48 65 69 2e 72 75 20 46 69 6e 6c 61 6e 64 20 2a 2f 0d 0a 2f 2a 20 24 66 69 6e 42 6c 75 65 3b 20 2d 20 66 69 6e 6e 69 73 68 20 66 6c ... >,
path:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\modules\_finnish_colors.css',
cwd: 'C:\\Users\ao\Desktop\Sites\heihei',
base: 'C:\\Users\ao\Desktop\Sites\heihei\app',
relative: 'assets\styles\modules\_finnish_colors.css',
dirname:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\modules',
basename: '_finnish_colors.css',
stem: '_finnish_colors',
extname: '.css' }
{ contents:
<Buffer 68 74 6d 6c 2c 20 62 6f 64 79 20 7b 70 61 64 64 69 6e 67 3a 30 3b 20 6d 61 72 67 69 6e 3a 30 3b 7d>,
path:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\modules\_general.css',
cwd: 'C:\\Users\ao\Desktop\Sites\heihei',
base: 'C:\\Users\ao\Desktop\Sites\heihei\app',
relative: 'assets\styles\modules\_general.css',
dirname:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\modules',
basename: '_general.css',
stem: '_general',
extname: '.css' }
{ contents:
<Buffer 2f 2a 20 48 65 69 48 65 69 2e 72 75 20 46 69 6e 6c 61 6e 64 20 2a 2f 0d 0a 2f 2a 20 23 39 45 31 42 33 34 20 d1 8f d1 80 d0 ba d0 be 2d d0 ba d1 80 d0 ... >,
path:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\modules\_topmenu-old.css',
cwd: 'C:\\Users\ao\Desktop\Sites\heihei',
base: 'C:\\Users\ao\Desktop\Sites\heihei\app',
relative: 'assets\styles\modules\_topmenu-old.css',
dirname:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\modules',
basename: '_topmenu-old.css',
stem: '_topmenu-old',
extname: '.css' }
{ contents:
<Buffer 23 6d 65 6e 75 2c 20 23 73 74 61 74 69 63 30 31 20 2c 20 23 73 74 61 74 69 63 30 32 2c 0d 0a 23 73 74 61 74 69 63 30 33 20 2c 23 73 74 61 74 69 63 30 ... >,
path:
'C:\\Users\ao\Desktop\Sites
\heihei\app\assets\styles\modules\_topmenu.css',
cwd: 'C:\\Users\ao\Desktop\Sites\heihei',
base: 'C:\\Users\ao\Desktop\Sites\heihei\app',
relative: 'assets\styles\modules\_topmenu.css',
dirname:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\modules',
basename: '_topmenu.css',
stem: '_topmenu',
extname: '.css' }
{ contents:
<Buffer 24 66 69 6e 42 6c 75 65 3a 20 23 30 30 32 66 36 63 3b 20>,
path:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\modules\_variables.css',
cwd: 'C:\\Users\ao\Desktop\Sites\heihei',
base: 'C:\\Users\ao\Desktop\Sites\heihei\app',
relative: 'assets\styles\modules\_variables.css',
dirname:
'C:\\Users\ao\Desktop\Sites\heihei
\app\assets\styles\modules',
basename: '_variables.css',
stem: '_variables',
extname: '.css' }
[15:19:05] Finished 'deploy2' after 78 ms

path - путь до файла

cwd - директрия, в которой была запущена команда

Видеоуроки

Документация

gulpjs.com/docs/en/api/src

Копирование по ftp

Передача файлов по ftp подробно разобрана в статье Отправить файлы по ftp с помощью Gulp