middleware - Browsersync 中间件替换字符串

Question

我正在尝试创建一个 Browsersync 中间件来替换 HTML 文件中的字符串，然后再将它们提供给浏览器。

我不完全确定这是可能的。

到目前为止，我能够确定何时请求 HTML 文件：

function hublMiddleware (req, res, next) {
  var parsed = require("url").parse(req.url);

  if (parsed.pathname.match(/\.html$/)) {}

  next();
};

我可以console.log()在if声明中添加一个，这样我就知道它正在工作。

但从这里我真的被困住了。我已经搜索了如何做到这一点的示例，例如

  res.removeHeader('Content-Length');

  res.pipe($.replace(/({{\s|\s}})|({%.*%})/g, '<!---->'))
    .pipe(res);

  return next();

但无济于事。

我应该说我正在使用带有 Gulp 的 Browsersync。对此的任何帮助将不胜感激！

Answer 1

这正是你想要的： bs-rewrite-rules

这是我使用它的方式：

gulp.task('serve', function () {
    browserSync({
        port: 8000,
        server: {
            baseDir: './'
        },
        plugins: ['bs-rewrite-rules'],
        rewriteRules: [
            {
                match: 'YOUR_GOOGLE_MAPS_API_KEY',
                replace:'<MY_ACTUAL_API_KEY>'
            }
        ]
    });

    gulp.watch(['*.html', 'css/**/*.css', 'js/**/*.js'], reload);
});