gulp-json-replace
Replace strings from a json file.
Setup
yarn add --dev @yodasws/gulp-json-replacenpm install @yodasws/gulp-json-replace --save-devUsage
Basic
index.html
<html>
<head>
<meta charset="utf-8" />
<title>%%title</title>
</head>
<body>
<h1>%%title</h1>
<u>%%author</u>
</body>
</html>config.json
{
"title": "JSON Replace for Gulp",
"author": "Sam Grundman"
}gulpfile.js:
const replace = require('gulp-json-replace');
gulp.task('json-replace', function() {
return gulp.src('src/**/*.html')
.pipe(replace({
src: './config.json',
}))
.pipe(gulp.dest('dist/'));
});Result:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>JSON Replace for Gulp</title>
</head>
<body>
<h1>JSON Replace for Gulp</h1>
<u>Sam Grundman</u>
</body>
</html>Advanced
index.html
<h1>{title}</h1>
<p>{openParagraph}</p>gulpfile.js:
gulp.task('json-replace', function() {
return gulp.src('src/**/*.html')
.pipe(replace({
src: {
title: 'Great New Story!',
},
keepNoMatch: true,
prefix: '{',
suffix: '}',
}))
.pipe(gulp.dest('dist/'));
});Result:
<h1>Great New Story!</h1>
<p>{openParagraph}</p>Options
options.src
Type: String or Object
Accepts either the path of the JSON content file or a JavaScript object.
options.prefix
Type: String
Default: %%
The string to open the search field.
options.suffix
Type: String
Default: ``
The string to close the search field.
options.keepNoMatch
Type: Boolean
Default: false
If true, will replace any search pattern not found in your JSON with an empty string.