{"id":20137,"library":"inject-html-webpack-plugin","title":"inject-html-webpack-plugin","description":"A webpack plugin that injects script tags and CSS links into HTML files using placeholder comments. Version 1.0.1 is the latest stable release. It provides an alternative to html-webpack-plugin with customizable injection markers, support for chunk-based asset injection, custom content injection, and transducer functions for CDN URL rewriting. Notable differentiators include simpler configuration via HTML comments and lower overhead.","status":"active","version":"1.0.1","language":"javascript","source_language":"en","source_url":"ssh://git@github.com/ali322/inject-html-webpack-plugin","tags":["javascript","webpack","html"],"install":[{"cmd":"npm install inject-html-webpack-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add inject-html-webpack-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add inject-html-webpack-plugin","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"CJS only; ESM imports may fail due to lack of default export.","wrong":"import InjectHtmlPlugin from 'inject-html-webpack-plugin';","symbol":"InjectHtmlPlugin","correct":"const InjectHtmlPlugin = require('inject-html-webpack-plugin');"},{"note":"Use CJS require or import with esModuleInterop for TypeScript.","wrong":"import * as InjectHtmlPlugin from 'inject-html-webpack-plugin';","symbol":"InjectHtmlPlugin","correct":"import InjectHtmlPlugin = require('inject-html-webpack-plugin'); (in TypeScript with esModuleInterop)"},{"note":"filename is relative to webpack context, default './index.html' works if file exists.","wrong":"new InjectHtmlPlugin({ filename: 'index.html' }) with no './' (relative path issue)","symbol":"new InjectHtmlPlugin(options)","correct":"new InjectHtmlPlugin({ filename: './index.html' })"}],"quickstart":{"code":"// webpack.config.js\nconst InjectHtmlPlugin = require('inject-html-webpack-plugin');\n\nmodule.exports = {\n  entry: './src/index.js',\n  output: {\n    path: './dist',\n    filename: 'bundle.js'\n  },\n  plugins: [\n    new InjectHtmlPlugin({\n      filename: './src/index.html',\n      chunks: ['main'],\n      transducer: 'https://cdn.example.com/',\n      custom: [{\n        start: '<!-- start:time -->',\n        end: '<!-- end:time -->',\n        content: Date.now()\n      }]\n    })\n  ]\n};","lang":"javascript","description":"Configures InjectHtmlPlugin to inject script and CSS links into an HTML file with CDN transducer and custom timestamp injection."},"warnings":[{"fix":"Ensure the HTML file specified by 'filename' exists in the output path before running webpack.","message":"Plugin does not generate HTML file; it only injects into existing files.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use same string as in entry configuration, e.g., entry: { index: './src/index.js' } → chunks: ['index'].","message":"Chunk names in 'chunks' array must match entry keys exactly; case-sensitive.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Ensure transducer string ends with '/' if used as URL base, or provide a function that handles path concatenation.","message":"Transducer can be a string prepended to asset paths or a function; using a string without trailing slash may break paths.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Manually escape HTML special characters if needed.","message":"Custom injection content is inserted as-is; no escaping or template processing.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Consider migrating to html-webpack-plugin for better support and features.","message":"Plugin may be deprecaed in favor of html-webpack-plugin which is more actively maintained.","severity":"deprecated","affected_versions":">=1.0.0"}],"env_vars":null,"search_vec":"'1.0.1':23 'altern':32 'asset':47 'base':46 'cdn':56 'chunk':45 'chunk-bas':44 'comment':21,66 'configur':63 'content':50 'css':14 'custom':49 'customiz':39 'differenti':60 'file':18 'function':54 'html':3,17,35,65,72 'html-webpack-plugin':34 'includ':61 'inject':2,10,40,48,51 'inject-html-webpack-plugin':1 'javascript':70 'latest':26 'link':15 'lower':68 'marker':41 'notabl':59 'overhead':69 'placehold':20 'plugin':5,8,37 'provid':30 'releas':28 'rewrit':58 'script':11 'simpler':62 'stabl':27 'support':42 'tag':12 'transduc':53 'url':57 'use':19 'version':22 'via':64 'webpack':4,7,36,71","created_at":"2026-04-25T11:21:30.920867+00:00","updated_at":"2026-04-25T11:21:30.920867+00:00","problems":[{"fix":"npm install inject-html-webpack-plugin --save-dev","cause":"Package not installed or missing from node_modules.","error":"Module not found: Error: Can't resolve 'inject-html-webpack-plugin'"},{"fix":"Use require() instead: const InjectHtmlPlugin = require('inject-html-webpack-plugin');","cause":"Using ES module import without default export adaption.","error":"TypeError: InjectHtmlPlugin is not a constructor"},{"fix":"Ensure the HTML file exists at the specified path, or update 'filename' accordingly.","cause":"The 'filename' option points to a non-existent file relative to webpack context.","error":"Error: Could not find file: ./index.html for injection"},{"fix":"Check options object for misspellings (e.g., 'filname' instead of 'filename') and ensure only valid keys: filename, chunks, transducer, etc.","cause":"Options passed to constructor have typos or invalid keys.","error":"ValidationError: Invalid options object. InjectHtmlPlugin has been initialized using an options object that does not match the API schema."}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":"","cli_version":null,"type":"library","homepage":null,"github":"https://github.com/ali322/inject-html-webpack-plugin","docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/inject-html-webpack-plugin","openapi_spec":null,"status_page":null,"smithery":null,"categories":["devops","web-framework"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-17","next_check":"2026-07-24","install_tag":null}}