[英]npm - managing vendors for distribution
我最近和Gulp.js和npm一起玩,很棒。 但是,我並沒有真正理解npm作為軟件包的軟件包管理器,它會被推送到dist。
我們來舉個例子吧。
我想下載最新的jquery,bootstrap和font-awesome,以便將它們包含在我的項目中。 我可以直接從他們的網站下載並獲取要包含的文件。 另一種選擇似乎是數據包管理器,即NPM。
但是,由於gulp等其他軟件包,我的node_modules目錄很大,並且它根本沒有嵌套。 將選定的包移動到另一個目錄的最簡單方法是什么 - 例如src/vendors/
我試圖通過node_modules
任務簡單地從node_modules
復制指定的文件並將它們移動到指定的目錄,但是從長遠來看它幾乎與手動復制文件相同,因為我不僅要指定輸入目錄,還要指定每個包的輸出目錄。
我目前的解決方案
gulp.task('vendors', function() {
var jquery = gulp.src(vendors.src.jquery)
.pipe(gulp.dest(vendors.dist.jquery));
var bootstrap = gulp.src(vendors.src.bootstrap)
.pipe(gulp.dest(vendors.dist.bootstrap));
return merge(jquery, bootstrap);
});
vendors = {
src: {
jquery: 'node_modules/jquery/dist/**/*',
bootstrap: 'node_modules/bootstrap/dist/**/*'
},
dist: {
jquery: 'src/resources/vendors/jquery',
bootstrap: 'src/resources/vendors/bootstrap'
}
}
有沒有選擇更快和/或更好地做到這一點?
無需為每個供應商庫顯式指定源和目標目錄。
請記住,gulp只是JavaScript。 這意味着您可以使用循環,數組和JavaScript提供的任何其他內容。
在您的情況下,您可以簡單地維護供應商文件夾名稱列表,迭代該列表並為每個文件夾構建流。 然后使用merge-stream
合並流:
var gulp = require('gulp');
var merge = require('merge-stream');
var vendors = ['jquery/dist', 'bootstrap/dist'];
gulp.task('vendors', function() {
return merge(vendors.map(function(vendor) {
return gulp.src('node_modules/' + vendor + '/**/*')
.pipe(gulp.dest('src/resources/vendors/' + vendor.replace(/\/.*/, '')));
}));
});
上面唯一棘手的部分是正確計算目標目錄。 我們希望node_modules/jquery/dist
中的所有內容最終都在src/resources/vendors/jquery
而不是在src/resources/vendors/jquery/dist
,所以我們必須在第一個/
使用正則表達式之后刪除所有內容。
現在,當您安裝新庫時,只需將其添加到vendors
數組並再次運行該任務即可。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.