如何将外部文件的内容加载到 gulp browser-sync
How to load contents of an external file into gulp browser-sync
我正在加载浏览器同步代理,并希望从外部文件中加载搜索和替换术语,以便在页面加载到浏览器中时对其进行修改。
我想从单独的文件加载搜索和替换项的原因是因为我想利用 gulp-watch 并在搜索和替换项更新时重新加载浏览器同步。
我的项目文件夹:
- regex/search.txt <- 搜索词存储在此文件中
- regex/replace.txt <- 替换词存储在此文件中
- gulpfile.js
gulpfile.js的内容:
var gulp = require('gulp'),
fs = require("fs"),
browserSync = require('browser-sync');
var proj_url = "http://www.example.com";
var search_text = "";
var replace_text = "";
gulp.task('readRegEx', function() {
return gulp.src('regex/*.txt')
.pipe(fs.readFile("regex/search.txt", "utf-8", function(err, data) {
search_text = data;
}))
.pipe(fs.readFile("regex/replace.txt", "utf-8", function(err, data) {
replace_text = data;
}))
});
gulp.task('browser-sync', function() {
browserSync({
proxy: {
target: proj_url
},
rewriteRules: [
{
match: search_text,
fn: function (match) {
return replace_text;
}
}
]
});
});
gulp.task('default', ['readRegEx','browser-sync'], function() {
gulp.watch(['regex/*.txt'], [browserSync.reload]);
});
这行不通。我收到以下错误:
TypeError: Cannot call method 'on' of undefined ...
为此,您需要在 readRegEx 中使浏览器同步依赖
gulp.task('browser-sync', ['readRegEx'], function() {
这保证了正确的执行顺序。
然后您可以通过这种方式使 readRegEx 同步(并且更简单):
gulp.task('readRegEx', function() {
search_text = fs.readFileSync("regex/search.txt", "utf-8").toString();
replace_text = fs.readFileSync("regex/replace.txt", "utf-8").toString();
});
我正在加载浏览器同步代理,并希望从外部文件中加载搜索和替换术语,以便在页面加载到浏览器中时对其进行修改。
我想从单独的文件加载搜索和替换项的原因是因为我想利用 gulp-watch 并在搜索和替换项更新时重新加载浏览器同步。
我的项目文件夹:
- regex/search.txt <- 搜索词存储在此文件中
- regex/replace.txt <- 替换词存储在此文件中
- gulpfile.js
gulpfile.js的内容:
var gulp = require('gulp'),
fs = require("fs"),
browserSync = require('browser-sync');
var proj_url = "http://www.example.com";
var search_text = "";
var replace_text = "";
gulp.task('readRegEx', function() {
return gulp.src('regex/*.txt')
.pipe(fs.readFile("regex/search.txt", "utf-8", function(err, data) {
search_text = data;
}))
.pipe(fs.readFile("regex/replace.txt", "utf-8", function(err, data) {
replace_text = data;
}))
});
gulp.task('browser-sync', function() {
browserSync({
proxy: {
target: proj_url
},
rewriteRules: [
{
match: search_text,
fn: function (match) {
return replace_text;
}
}
]
});
});
gulp.task('default', ['readRegEx','browser-sync'], function() {
gulp.watch(['regex/*.txt'], [browserSync.reload]);
});
这行不通。我收到以下错误:
TypeError: Cannot call method 'on' of undefined ...
为此,您需要在 readRegEx 中使浏览器同步依赖
gulp.task('browser-sync', ['readRegEx'], function() {
这保证了正确的执行顺序。
然后您可以通过这种方式使 readRegEx 同步(并且更简单):
gulp.task('readRegEx', function() {
search_text = fs.readFileSync("regex/search.txt", "utf-8").toString();
replace_text = fs.readFileSync("regex/replace.txt", "utf-8").toString();
});