https://github.com/gozenc/interpolate-html-plugin

InterpolateHtmlPlugin implemented for webpack v5
https://github.com/gozenc/interpolate-html-plugin

Last synced: about 2 months ago
JSON representation

InterpolateHtmlPlugin implemented for webpack v5

• Host: GitHub
• URL: https://github.com/gozenc/interpolate-html-plugin
• Owner: gozenc
• Created: 2021-03-31T22:37:55.000Z (almost 4 years ago)
• Default Branch: master
• Last Pushed: 2021-04-01T21:20:03.000Z (almost 4 years ago)
• Last Synced: 2024-11-19T09:04:26.181Z (2 months ago)
• Language: TypeScript
• Homepage:
• Size: 129 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
InterpolateHtmlPlugin


Replaces your variable names in your HTML templates.
 
Inspired from react-dev-utils/interpolate-html-plugin.
 Written in TypeScript with ♥ 


## Overview

It works in combination with latest versions of [`HtmlWebpackPlugin`](https://github.com/jantimon/html-webpack-plugin]) and [`webpack`](https://webpack.js.org/). You can learn more about creating plugins like this [here](https://github.com/jantimon/html-webpack-plugin]).

## Installation

| NPM                                        | YARN                                          |

| ------------------------------------------ | --------------------------------------------- |

| `npm i -D webpack html-webpack-plugin`     | `yarn add -D webpack html-webpack-plugin`     |

| `npm i -D @gozenc/interpolate-html-plugin` | `yarn add -D @gozenc/interpolate-html-plugin` |

## Usage

```js

const HtmlWebpackPlugin = require("html-webpack-plugin")

const InterpolateHtmlPlugin = require("@gozenc/interpolate-html-plugin")

// In the webpack.config file:

...

plugins: [

    new InterpolateHtmlPlugin(HtmlWebpackPlugin, {

        'PUBLIC_URL': "https://example.com",

        // Replaces %PUBLIC_URL% with https://example.com in index.html.

        VARIABLE: 1024,

        // Replaces %VARIABLE% with 1024 in index.html.

    }),

    ...

```

## Development

I know build pipeline looks kinda strange, but I am making some Linux practice with node concurrently for performant build pipelines. I may insert some C calls into it too. I'll develop it further in the future, but of course I am open for discussions for it.

Also just open a ticket for feature requests of course, I'll be glad to resolve them.

## ToDo

-   Add webpack@3 support.

-   Add webpack@4 support.

-   More testing suites for development.

-   Type definitions for hook.tap params.