Browsersync 中间件替换字符串答案

【问题标题】：Browsersync Middleware to Replace StringBrowsersync 中间件替换字符串
【发布时间】：2017-03-19 17:33:30
【问题描述】：

我正在尝试创建一个 Browsersync 中间件，以在 HTML 文件提供给浏览器之前替换它们中的字符串。

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

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

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

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

  next();
};

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

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

  res.removeHeader('Content-Length');

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

  return next();

但无济于事。

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

【问题讨论】：

标签： middleware browser-sync gulp-browser-sync

【解决方案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);
});

【讨论】：