用於Gulp配置的乙烯基FTP

Question

我正在使用Gulp從文件保存中的LESS-CSS生成CSS。我希望立即將css文件上傳到服務器，所以我正在試驗乙烯基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文件。該文件位於相對於我的gulp目錄的../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文件被上傳到服務器上的正確目錄中嗎？

感謝名單，

託姆

Answer 1

我有同樣的問題。 Vinylftp在目標文件夾中創建源文件夾結構。爲了避免這個問題，只需將目標地址更改爲Web服務器的根目錄即可。 我的代碼有點不同，但它顯示問題出在哪裏。

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)) 
    ; 
});