Виниловый FTP для конфигурации Gulp

Question

Я использую Gulp для генерации CSS из LESS-CSS при сохранении файла. Я хочу, чтобы файл css был немедленно загружен на сервер, поэтому я экспериментирую с Vinyl-FTP. Я новичок в NPM/NodeJS/Gulp/JavaScript, поэтому мне нужна помощь.

В мой gulpfile.js я включил этот код (конечно, скрывая хост, пользователя и пароль):

// Vinyl FTP 
gulp.task( 'deploy', function () {

    var conn = ftp.create( {
        host:     'ftp-server',
        user:     'user',
        password: 'password',
        parallel: 10,
        log:      gutil.log
    } );

    var globs = [
        '../site/templates/templatename/css/bootstrap.min.css'
    ];


    return gulp.src( globs, { base: '.', buffer: false } )
        .pipe( conn.newer( '/public_html/dev2/templates/templatename/css' ) ) 
        .pipe( conn.dest( '/public_html/dev2/templates/templatename/css' ) );

} );

Я хочу, чтобы файл bootstrap.min.css загружался при каждом нажатии "Сохранить". Файл находится по адресу ../site/templates/templatename/css/bootstrap.min.css относительно моего каталога глотка. Я хочу, чтобы он был загружен на мой сайт разработки, который находится по адресу /public_html/dev2/templates/templatename/css на сервере (да, это Joomla).

По-видимому, я использую неправильный путь, потому что это то, что он производит:

    [14:44:21] Using gulpfile /mnt/e/Sites/successfulspeakernow.com/gulp/gulpfile.js
[14:44:21] Starting 'less'...
[14:44:21] Finished 'less' after 20 ms
[14:44:21] Starting 'watch'...
[14:44:21] Finished 'watch' after 267 ms
[14:44:21] Starting 'deploy'...
[14:44:21] CONN 
[14:44:23] READY
[14:44:23] MLSD  /public_html/dev2/templates/templatename/site/templates/templatename/css
[14:44:23] MLSD  /public_html/dev2/templates/templatename/site/templates/templatename
[14:44:23] MLSD  /public_html/dev2/templates/templatename/site/templates
[14:44:23] MLSD  /public_html/dev2/templates/templatename/site
[14:44:23] MLSD  /public_html/dev2/templates/templatename
[14:44:23] MLSD  /public_html/dev2/templates
[14:44:23] MKDIR /public_html/dev2/templates/templatename/site
[14:44:23] MKDIR /public_html/dev2/templates/templatename/site/templates
[14:44:23] MKDIR /public_html/dev2/templates/templatename/site/templates/templatename
[14:44:23] MKDIR /public_html/dev2/templates/templatename/site/templates/templatename/css
[14:44:23] PUT   /public_html/dev2/templates/templatename/site/templates/templatename/css/bootstrap.min.css
[14:44:23] UP     37% /public_html/dev2/templates/templatename/site/templates/templatename/css/bootstrap.min.css
[14:44:23] UP     74% /public_html/dev2/templates/templatename/site/templates/templatename/css/bootstrap.min.css
[14:44:23] UP    100% /public_html/dev2/templates/templatename/site/templates/templatename/css/bootstrap.min.css
[14:44:23] Finished 'deploy' after 1.86 s
[14:44:23] Starting 'default'...
[14:44:23] Finished 'default' after 8.9 μs
[14:44:23] DISC 

и когда я иду туда с моей программой FTP, я нахожу это:

/public_html/dev2/templates/templatename/site/templates/templatename/css/bootstrap.min.css

Можете ли вы объяснить, что нужно настроить, чтобы файл bootstrap.min.css был загружен в нужный каталог на сервере?

Thanx,

Thom

Answer 1

У меня такая же проблема. Vinylftp создает структуру исходных папок в папке назначения. Чтобы избежать этой проблемы, просто измените назначение на корневой каталог вашего веб-сервера. Мой код немного отличается, но он показывает, где проблема.

var gulp = require('gulp');
var gutil = require( 'gulp-util' );
var ftp = require( 'vinyl-ftp' );

/** Configuration **/
var user = 'username';
var password = 'password';
var host = 'hostname';  
var port = 21;  
var localFilesGlob = ['public_html/templates/protostar/css/template.css'];  
var remoteFolder = ''; // <- HERE MUST BE AN EMPTY STRING TO POINT THE VINYLFTP TO ROOT


function getFtpConnection() {  
    return ftp.create({
        host: host,
        port: port,
        user: user,
        password: password,
        parallel: 5,
        log: gutil.log
    });
}

gulp.task('ftp-deploy', function() {

    var conn = getFtpConnection();

    return gulp.src(localFilesGlob, { base: '.', buffer: false })
        .pipe( conn.newer( remoteFolder ) ) // only upload newer files 
        .pipe( conn.dest( remoteFolder ) )
    ;
});