https://github.com/aganglada/pattern-replace-loader
🔬 Pattern replace loader for webpack
https://github.com/aganglada/pattern-replace-loader
regex replace string webpack webpack-loader
Last synced: 10 months ago
JSON representation
🔬 Pattern replace loader for webpack
- Host: GitHub
- URL: https://github.com/aganglada/pattern-replace-loader
- Owner: aganglada
- License: mit
- Created: 2017-02-10T16:44:07.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2022-11-15T21:40:13.000Z (about 3 years ago)
- Last Synced: 2025-03-26T06:24:09.107Z (10 months ago)
- Topics: regex, replace, string, webpack, webpack-loader
- Language: JavaScript
- Homepage:
- Size: 23.4 KB
- Stars: 5
- Watchers: 1
- Forks: 4
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 🔬 pattern-replace-loader
[](#contributors-)
Pattern replace loader for [webpack](https://webpack.js.org/)
Perform plain string and regular expressions.
## Install:
```bash
$ npm install --save-dev pattern-replace-loader
```
or using yarn
```bash
$ yarn add pattern-replace-loader --dev
```
## Usage:
**Plain**: It uses [String.prototype.replace()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace) to perform replaces in file contents.
**Regex**: It will go and look for all the occurrences of what you've specified in `options.search` with `g` flag in `options.flags`, etc.
### Plain replacement:
In your `webpack.config.js`:
```javascript
module.exports = {
// ...
module: {
rules: [
{
test: /filename\.js$/,
loader: 'pattern-replace-loader',
options: {
search: '[variable]',
replace: 'Hello'
}
}
]
}
}
```
### RegExp replacement:
To be able to use RegExp in yuor replacement you should specify `flags` in the options param. In this case, `search` and `flags` are being
passed to the [RegExp](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) constructor.
In your `webpack.config.js`:
```javascript
module.exports = {
// ...
module: {
rules: [
{
test: /filename\.js$/,
loader: 'pattern-replace-loader',
options: {
search: '[variable]',
replace: 'Hello',
flags: 'gi'
}
}
]
}
}
```
### Multiple replacement:
Also, you can pass an array of objects of search/replace pairs this way:
In your `webpack.config.js`:
```javascript
module.exports = {
// ...
module: {
rules: [
{
test: /\.js$/,
loader: 'pattern-replace-loader',
options: {
multiple: [
{ search: '[variable1]', replace: 'Hello' },
{ search: '[variable2]', replace: 'Bye!' }
]
}
}
]
}
}
```
### Verbose output:
You can enable verbose output to check which files have been processed by the replace loader.
In your `webpack.config.js`:
```javascript
module.exports = {
// ...
module: {
rules: [
{
test: /filename\.js$/,
loader: 'pattern-replace-loader',
options: {
verbose: true,
search: '[variable]',
replace: 'Hello'
}
}
]
}
}
```
## Contributing:
Feel free to open issues to propose stuff and participate.
Pull requests are also welcome.
## Licence:
[MIT](http://en.wikipedia.org/wiki/MIT_License)
## Contributors ✨
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
Alejandro Garcia Anglada
💻 🤔
mathiasscheffe
💻
This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!