如何解决已解决-gulp:为网站构建多个dist,每个dist都有自己的自定义js
我目前正在开发一个小型网站,使用的引导模板包括我刚接触的gulp。 gulpfile已经具有构建功能,可以为最终网站构建dist目录。
诀窍在于,我想建立多个网站,这些网站会因我要在某些页面上加载的javascript文件的内容而异,因此我已经准备好其中的6个javascript文件。
我发现html文件中的gulp部分可以正常工作:
@@if (context.test == 1) {
@@include("partials/scripts_shop_1.html")
}
@@if (context.test == 2) {
@@include("partials/scripts_shop_2.html")
}
and so on...
我的gulp文件看起来像这样
gulp.task('copy:all',function() {
return gulp
.src([
paths.src.base.files,'!' + paths.src.partials.dir,'!' + paths.src.partials.files,'!' + paths.src.scss.dir,'!' + paths.src.scss.files,'!' + paths.src.tmp.dir,'!' + paths.src.tmp.files,'!' + paths.src.js.dir,'!' + paths.src.js.files,'!' + paths.src.css.dir,'!' + paths.src.css.files,'!' + paths.src.html.files
])
.pipe(gulp.dest(paths.dist.base.dir));
});
gulp.task('copy:libs',function() {
return gulp.src(npmdist(),{
base: paths.base.node.dir
}).pipe(gulp.dest(paths.dist.libs.dir));
});
gulp.task('html',function() {
return gulp
.src([paths.src.html.files,'!' + paths.src.partials.files])
.pipe(
fileinclude({
prefix: '@@',basepath: '@file',indent: true,context: {'test': 1}
})
)
.pipe(replace(/href="(.{0,10})node_modules/g,'href="$1assets/libs'))
.pipe(replace(/src="(.{0,'src="$1assets/libs'))
.pipe(useref())
.pipe(cached())
.pipe(gulpif('*.js',uglify()))
.pipe(gulpif('*.css',cleancss()))
.pipe(gulp.dest(paths.dist.base.dir));
});
gulp.task(
'build',gulp.series(
gulp.parallel('clean:tmp','clean:dist','copy:all','copy:libs'),'scss','html'
)
);
您可以看到测试参数,该参数可以让我知道要在html文件中加载哪个版本的脚本。
我想做的是能够执行一次gulp任务,一次构建所有6个网站,以便能够在html函数中传递参数并使其循环运行。复制功能选择不同的目录与我有相同的操作,但我认为将遵循相同的过程。
任何帮助将不胜感激:)
爱德华
解决方法
最后,我遇到了有关从第一网站缓存某些必须更改其他资产的资产的问题。使用gulp选项禁用缓存会导致其他问题。
我发现的解决方案不是在同一个gulp文件中生成所有站点,而是使用this文章中所述的参数。我了解不建议您这样做,但在这里对我有用。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。