gpt4 book ai didi

npm - 管理分发供应商

转载 作者:行者123 更新时间:2023-12-02 20:50:10 25 4
gpt4 key购买 nike

我最近在玩 Gulp.js 和 npm,非常棒。然而,我并没有真正理解 npm 作为将被推送到 dist 的包的包管理器的想法。

让我们举个例子。

我想下载最新的 jquery、bootstrap 和 font-awesome,以便将它们包含到我的项目中。我可以简单地从他们的网站下载它们并获取要包含的文件。另一个选择似乎是数据包管理器,即 NPM。

但是,由于 gulp 等其他包的原因,我的 node_modules 目录很大,而且根本没有嵌套。将选定的包移动到另一个目录的最简单方法是什么 - 例如 src/vendors/

我试图通过 gulp 任务简单地从 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 数组中,然后再次运行任务即可。

关于npm - 管理分发供应商,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42492286/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com