Skip to content

Automatically inlines your runtime chunk(s) based on your webpack settings (with html-webpack-plugin).

License

Notifications You must be signed in to change notification settings

chippers/html-webpack-inline-runtime-plugin

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

31 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

html-webpack-inline-runtime-plugin

github actions npm

Automatically creates inline scripts for your runtime chunk(s) based on your runtimeChunk setting in the optimization key of webpack settings. Requires html-webpack-plugin.

See optimization.runtimeChunk in the webpack documentation for the valid configuration settings. The plugin itself needs no configuration, it should activate automatically as long as runtimeChunk isn't disabled/not set.

Usage

Here is a simplified webpack configuration that would activate this plugin. This config also uses [contenthash] in the filename and hashes module ids (neither are a requirement of the plugin) to help with long term caching which might be of interest for those that are already optimizing their runtime http requests.

const HtmlPlugin = require("html-webpack-plugin");
const HtmlRuntimePlugin = require("html-webpack-inline-runtime-plugin");

module.exports = {
  mode: "production",
  output: {
    filename: "[name].[contenthash].js"
  },
  optimization: {
    moduleIds: "hashed",
    runtimeChunk: "single" // config value that the plugin reads
  },
  plugins: [
    new HtmlPlugin(),
    new HtmlRuntimePlugin()
  ]
};

About

Automatically inlines your runtime chunk(s) based on your webpack settings (with html-webpack-plugin).

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •