# @jenkshiny/gulp-manifest-replace

> A gulp plugin that replace specified sources from manifes json.

Latest version **1.0.2** (published 2019-04-07) · MIT license · 0 weekly downloads

## Install

```sh
npm install @jenkshiny/gulp-manifest-replace
pnpm add @jenkshiny/gulp-manifest-replace
yarn add @jenkshiny/gulp-manifest-replace
bun add @jenkshiny/gulp-manifest-replace
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.2 |
| Published | 2019-04-07 |
| First published | 2019-01-03 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=0.10 |
| Dependencies | 1 |
| Unpacked size | 7.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 4 |
| Author | Jenkin Tang |
| Maintainers | jenkshiny |
| Keywords | gulp, manifest, replace |

## Links

- npm: https://www.npmjs.com/package/@jenkshiny/gulp-manifest-replace
- Repository: https://github.com/jenkshiny/gulp-manifest-replace
- Homepage: https://github.com/jenkshiny/gulp-manifest-replace#readme
- Issues: https://github.com/jenkshiny/gulp-manifest-replace/issues
- npm.io page: https://npm.io/package/@jenkshiny/gulp-manifest-replace

## Dependencies (1)

- [through2](https://npm.io/package/through2.md) ^2.0.3

## Recent versions

- 1.0.2 (latest) — 2019-04-07
- 1.0.1 — 2019-01-03

## README

# gulp-manifest-replace [![Build Status](https://travis-ci.com/jenkshiny/gulp-manifest-replace.svg?branch=master)](https://travis-ci.com/jenkshiny/gulp-manifest-replace) [![npm](https://img.shields.io/npm/v/@jenkshiny/gulp-manifest-replace.svg)](https://www.npmjs.com/package/@jenkshiny/gulp-manifest-replace)
> A gulp plugin that replace specified sources from manifes json.

**This plugin is an improved and maintained fork of [gulp-rev-replace](https://github.com/jamesknelson/gulp-rev-replace).**

## Usage

First, install `gulp-manifest-replace` as a development dependency:

```shell
npm i -D @jenkshiny/gulp-manifest-replace
```

Then, add it to your `gulpfile.js`:

### Simple string replace
```javascript
const replace = require('gulp-manifest-replace');
const manifestJson = require('manifest.json');

gulp.task('replace', function(){
  gulp.src(['*.html'])
    .pipe(replace({ manifest: manifestJson }))
    .pipe(gulp.dest('output/'));
});
```

### String replace with prefix and matched callback
```javascript
const replace = require('gulp-manifest-replace');
const manifestJson = require('manifest.json');

gulp.task('replace', function(){
  gulp.src(['*.html'])
    .pipe(replace({ 
      manifest: manifestJson,
      prefix: 'build/',
      matched: function(source, unreved, reved) {
            const ext = path.extname(unreved);
            const _unreved = unreved.replace(new RegExp(ext + '$'), '');
            return source.replace(new RegExp(_unreved + '(.([A-Za-z0-9.]{5,}))?' + ext + '(\s{0,})?(["|\'])', 'gim'), reved + '$3$4');
          }
    }))
    .pipe(gulp.dest('output/'));
});
```

## Before
### source
```html
<link rel="icon" type="image/x-icon" href="assets/icon.png"/>
<link href="index.css" rel="stylesheet">
<script src="index.js"></script>
<script>
  require('index.js');
</script>
```
### manifest
```json
{
  "index.js": "index.b0ce1e8.js",
  "index.css": "index.4f36a77.css",
  "assets/icon.png": "assets/icon.4336db5.png"
}
```
## After Replace
### output
```html
<link rel="icon" type="image/x-icon" href="assets/icon.4336db5.png"/>
<link href="index.4f36a77.css" rel="stylesheet">
<script src="index.b0ce1e8.js"></script>
<script>
  require('index.b0ce1e8.js');
</script>
```
### Of course, when your manifest.json was changed, you can override the output files for replacement.
```json
{
  "index.js": "index.b0ce1e8e4d1ff123.js",
  "index.css": "index.4f36a77fg1f37dg8.css",
  "assets/icon.png": "assets/icon.4336db5fs51w34.png"
}
```
```html
<link rel="icon" type="image/x-icon" href="assets/icon.4336db5fs51w34.png"/>
<link href="index.4f36a77fg1f37dg8.css" rel="stylesheet">
<script src="index.b0ce1e8e4d1ff123.js"></script>
<script>
  require('index.b0ce1e8e4d1ff123.js');
</script>
```

## API

gulp-manifest-replace can be called with a string or regex.

### replace([options])

#### options
Type: `object`

##### manifest
Type: `object`
```json
{
  "index.js": "index.b0ce1e8.js",
  "index.css": "index.4f36a77.css",
  "assets/icon.png": "assets/icon.4336db5.png"
}
```

##### prefix
Type: `String`

###### Add a prefix to each replacement.

##### matched
Type: `Function`

###### You can use this function to customize the replacement logic and return the modified source.

---
_Source: https://npm.io/package/@jenkshiny/gulp-manifest-replace · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._