0

在使用 Gulp将.pipedev.html转换为public.html时，我需要替换以下代码块

<!-- replaceStart: nameOfBlock-css -->
  <link href="/css/one.css" />
  <link href="/css/two.css" />
  <link href="/css/three.css" />
<!-- replaceEnd-->

<!-- replaceStart: nameOfBlock-js -->
  <link href="/js/one.js"/>
  <link href="/js/two.js/>
<!-- replaceEnd-->

包含minifiedCSSLinks.css的内容

<link href="/css/oneTwoThree.min.css" />

和minifiedJSLink.js

<link href="/js/oneTwo.min.js" />

gulp-html-replace，gulp-replace或gulp-string-replace，可能会完成这项工作，但我不知道如何让它们简单地获取文件的内容（除了读取文件的内容并传递给替换函数作为一个字符串 - 我想相信模块可以做到这一点）。理想情况下，我希望在gulpfile.js中有这样的东西：

gulp.src('default.html')
.replace({nameOfBlock-css: 'minifiedCSSLinks.html'})
.replace({nameOfBlock-js: 'minifiedJSLinks.html'})
...

编辑：*.min.css|js脚本和样式将通过原始*.css|js的连接和缩小来创建。原始文件在开发时使用，而缩小的输出将在生产中使用。因此，在 Gulp 构建过程中，html 文件中的链接标签也需要更改以反映这一点，并指向新创建的*.min文件。

4

1 回答 1

0

好的，到目前为止我正在使用gulp-html-replace它，因为它适用于<!-- build:<name> --> .. <!-- endbuild: -->块。我不能让它直接从文件中读取 HTML（如果我忽略了这个选项，请告诉我），所以我只是将文件内容作为字符串传递：

gulp.src('default.html')
.replace({nameOfBlock-css: fs.readFileSync('minifiedCSSLinks.html', 'utf8')})
.replace({nameOfBlock-js: fs.readFileSync('minifiedJSLinks.html', 'utf8')})
...
于 2020-04-28T20:51:53.660 回答