gulp - 更新文件时重新加载浏览器同步 RewriteRules

Question

我正在尝试重写通过 BrowserSync 代理加载的站点的 HTML。

我有一个:

• ./src/search.txt -- 包含正则表达式匹配
• ./build/replace.txt -- 包含网页的替换 HTML

我希望每次更改这些文件中的任何一个时重新加载 browserSync。

我的gulp文件:

gulp.task('readRegEx', function() {
    search_text = fs.readFileSync("./src/search.txt", "utf-8").toString();
    replace_text = fs.readFileSync("./build/replace.txt");
});

gulp.task('browser-sync', ['readRegEx'], function() {
    browserSync({
        files: ['./src/search.txt','./build/replace.txt'],
        proxy: {
            target: "http://www.example.com"
        },
        rewriteRules: [
            {
                match: new RegExp(search_text,"g"),
                once: true,
                fn: function (match) {
                    return replace_text;
                }
            }
        ]
    });
});

这几乎行得通。

它读取/src/search.txt 并加载(正则表达式)，然后用/build/replace.txt 的内容替换它。

但它只能工作一次。因此，如果我更新 search.txt 或 replace.txt，则 browserSync 会重新加载，但 rewriteRules 位不会再次运行。

有没有办法告诉 browserSync 中的 rewriteRules 在文件更新时再次运行？

Answer 1

我认为你应该每次都阅读这些文件。

    gulp.task('readRegEx', function() {
        search_text = fs.readFileSync("./src/search.txt", "utf-8").toString();
        replace_text = fs.readFileSync("./build/replace.txt");
    });

    gulp.task('browser-sync', ['readRegEx'], function() {
        browserSync({
            files: ['./src/search.txt','./build/replace.txt'],
            proxy: {
                target: "http://www.example.com"
            },
            rewriteRules: [
                {
                    match: new RegExp(fs.readFileSync("./src/search.txt", "utf-8").toString(), "g"),
                    once: true,
                    fn: function (match) {
                        return fs.readFileSync("./build/replace.txt");
                    }
                }
            ]
        });
    });