Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
html-webpack-hot-plugin
Advanced tools
Readme
HtmlWebpackPlugin with hot reload
When using webpack with hot module replacement, the update of html file in htmlWebpackPlugin will not trigger anything. And the notice in console will show something like "app is up to date". Refreshing the page manually is the only choice if you wanna see the latest update. And this plugin is for solving this. It will send signal to opened client when the content in htmlWebpackPlugin changes and a full reload
will be triggered.
Changes that can be hot updated:
Because the script may change the dom element in html template, The following actions will not be considered for hot updates:
Deletion
: Deleted elements may relate to script execution, such as dom manipulation
, event listening
as so on.Insertion
: It's hard to determine where to insert the new added dom elements if there are non-template elements that were added during scripts execution.Movement
: The same as Insertion
.This is an extension of HTMLWebpackPlugin
This is a tool just used in `Development` mode.
npm i --save-dev html-webpack-hot-plugin
yarn add --dev html-webpack-hot-plugin
Notice: Below configuration is for webpack4
const HtmlWebpackPlugin = require('html-webpack-plugin')
const HtmlWebpackHotPlugin = require('html-webpack-hot-plugin')
const htmlHotPlugin = new HtmlWebpackHotPlugin({
// enable hot update, default: true
// if hot update acting strangly, set it to false, and open an issue here:
// https://github.com/cxphoe/html-webpack-hot-plugin
hot: true,
})
module.exports = {
entry: 'index.js',
output: {
path: __dirname + '/dist',
filename: 'index_bundle.js',
},
plugins: [
new HtmlWebpackPlugin({
filename: 'test.html',
template: 'src/assets/test.html',
}),
// the instance of this plugin must be placed after instances of HtmlWebpackPlugin
htmlHotPlugin,
],
devServer: {
before(app, server) {
// This step is curcial. DevServer is needed to send reload message to opened page.
// Without this step, the update of HtmlWebpackHotPlugin will be omitted and you will need to refresh the page manually.
htmlHotPlugin.setDevServer(server)
},
},
}
FAQs
HtmlWebpackPlugin with hot reload
The npm package html-webpack-hot-plugin receives a total of 541 weekly downloads. As such, html-webpack-hot-plugin popularity was classified as not popular.
We found that html-webpack-hot-plugin demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.