1. gulp-string-replace
Replace strings in files by using string or regex patterns.
gulp-string-replace
Package: gulp-string-replace
Created by: tomaszczechowski
Last modified: Sat, 18 Jun 2022 18:02:55 GMT
Version: 1.1.2
License: MIT
Downloads: 52,907
Repository: https://github.com/tomaszczechowski/gulp-string-replace

Install

npm install gulp-string-replace
yarn add gulp-string-replace

gulp-string-replace NPM version Build status dependencies

Replaces strings in files by using string or regex patterns. Works with Gulp 3!

Usage

 npm install gulp-string-replace --save-dev

Regex Replace

 var replace = require('gulp-string-replace');

gulp.task('replace_1', function() {
  gulp.src(["./config.js"]) // Any file globs are supported
    .pipe(replace(new RegExp('@env@', 'g'), 'production'))
    .pipe(gulp.dest('./build/config.js'))
});

gulp.task('replace_2', function() {
  gulp.src(["./index.html"])
    .pipe(replace(/version(={1})/g, '$1v0.2.2'))
    .pipe(gulp.dest('./build/index.html'))
});

gulp.task('replace_3', function() {
  gulp.src(["./config.js"])
    .pipe(replace(/foo/g, function () {
        return 'bar';
    }))
    .pipe(gulp.dest('./build/config.js'))
});

String Replace

 gulp.task('replace_1', function() {
  gulp.src(["./config.js"])
    .pipe(replace('environment', 'production'))
    .pipe(gulp.dest('./build/config.js'))
});

Function Replace

 gulp.task('replace_1', function() {
  gulp.src(["./config.js"])
    .pipe(replace('environment', function () {
        return 'production';
    }))
    .pipe(gulp.dest('./build/config.js'))
});

gulp.task('replace_2', function() {
  gulp.src(["./config.js"])
    .pipe(replace('environment', function (replacement) {
        return replacement + '_mocked';
    }))
    .pipe(gulp.dest('./build/config.js'))
});

Exampe with options object

 
var options = {
  logs: {
    enabled: false
  }
};

gulp.task('replace_1', function() {
  gulp.src(["./config.js"])
    .pipe(replace('environment', 'dev', options)
    .pipe(gulp.dest('./build/config.js'))
});

 
var options = {
  searchValue: 'string'
};

gulp.task('replace_1', function() {
  gulp.src(["./config.js"])
    .pipe(replace('(some value here /* ignore by sth */)(', 'dev', options)
    .pipe(gulp.dest('./build/config.js'))
});

API

replace(pattern, replacement, options)

pattern

Type: String or RegExp

The string to search for.

replacement

Type: String or Function

The replacement string or function. Called once for each match.
Function has access to regex outcome (all arguments are passed).

options

Type: Object

options.searchValue

Type: string, Default: regex, Options: regex or string
Description: Used to determine if search value is regex or string.

options.logs.enabled

Type: Boolean, Default: true

Displaying logs.

options.logs.notReplaced

Type: Boolean, Default: false

Displaying "not replaced" logs.

More details here: MDN documentation for RegExp and MDN documentation for String.replace.

Release History

  • 2018-10-12 v1.1.2 Fixed issue wrong stream parameters.
  • 2018-07-13 v1.1.1 Moved gulp into devDependencies.
  • 2018-05-24 v1.1.0 Added support for node 8+ by replacing buffer with buffer.from. Added searchValue option. Updated dependencies.
  • 2017-12-31 v1.0.0 Removed a gulp-util, clean up and released v1.0.0
  • 2017-11-19 v0.4.0 Passed entire regex outcome to replace function.
  • 2017-01-04 v0.3.1 Improved documentation. Removed duplicated comments & Fixed typo.
  • 2016-11-30 v0.3.0 Default value for "notReplaced" set to "false".
  • 2016-09-24 v0.2.0 Added options object.
  • 2016-09-09 v0.1.1 Reorganization of files along with minor cosmetic changes.
  • 2016-03-09 v0.1.0 Initial version of plugin.

Task submitted by Tomasz Czechowski. License MIT.

Dependencies

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin