Question

我有一个index.html和一个header.html。我想做的是有一个gulp任务，从header.html获取文本并将其插入index.html。例如：

了header.html

abcdef
ghijkl

插入前

index.html

line1
line2
<!-- header:start -->
...
...
...
<!-- header:end -->
line3

插入后

index.html

line1
line2
<!-- header:start -->
abcdef
ghijkl
<!-- header:end -->
line3
line4

任何人都可以帮助我，并告诉我如何做到这一点吗？

Answer 1

你的追求绝对是可以实现的。最快捷，最简单的可能是使用一个众所周知的诱人解决方案，如https://www.npmjs.com/package/gulp-mustache＆amp; http://mustache.github.io/mustache.5.html

看起来像

的src /路由/ index.html中

<html>
{{> ../partials/head.html }}
</html>

的src /分音/ head.html

<head>
  <link .... />
  <somethingelse>
</head>

gulp文件

gulp.src("./src/routes/*.html")
    .pipe(mustache()).pipe(gulp.dest("./dist"));

应该有希望产生

DIST / index.html中

<html>
  <head>
    <link .... />
    <somethingelse>
  </head>
</html>

虽然我没有完全尝试过这些片段，但我认为应该传达这些想法：）

与纯JS＆amp; gulp也是可能的，它可能需要一个自定义的流处理器和某种搜索替换等等。但除非你有理由不使用外部依赖，否则我会建议诱人的库方法，因为你将安装获得更多的功能（循环等等）