如何在Gulp中建立html文件的链接列表？

bjg7j2ky 于 2022-12-08 发布在 Gulp

关注(0)|答案(1)|浏览(152)

如何使用Gulp在一个html文件中收集目录中所有页面的列表？
例如，在build目录中，我有两个文件contact.html，标题为**“Contacts”，faq.html的标题为“Frequently asked questions”**，我需要获取它们并创建一个ui.html，它是指向以下格式文件的链接列表：

<a href="faq.html">Frequently asked questions</a>
<a href="contact.html">Contacts</a>

好了，添加了步骤你的设计（一个连接的css文件）。
找到了gulp-listing模块，但无法自定义，如下所示：

gulp.task('scripts', function() {
return gulp.src('./src/*.html')
.pipe(listing('listing.html'))
.pipe(gulp.dest('./src/'));
});

gulp

来源：https://stackoverflow.com/questions/56949468/how-to-build-a-list-of-links-to-html-files-in-gulp

1条答案

按热度按时间

kq0g1dla1#

我用了两个吞咽模块来完成这个任务。

gulp-filelist-用于创建文件列表
gulp-modify-file-用于更新此文件

gulp
  .src(['./html/**/*.html'])
  .pipe(require('gulp-filelist')('filelist.js', { relative: true }))
  .pipe(require('gulp-modify-file')((content) => {
     const start = 'var list = '
     return `${start}${content}`
   }))
 .pipe(gulp.dest('js'))

在run gulp之后，您得到了js/filelist.js，如下所示：

var list = [
   "Cancellation/template.html",
   "Cancellation/email.html",
 ]

您可以将此脚本添加到html文件中，并使用js显示所有信息。

赞(0）回复(0）举报 2022-12-08

我来回答

如何在Gulp中建立html文件的链接列表？

1条答案

相关问题

热门标签

最新问答