and <link> tags instead.","severity":"deprecated","affected_versions":">=2.0.0"},{"fix":"Use 'preHeadScripts' for scripts that must run before other head scripts (e.g., polyfills), 'headScripts' for general head scripts, 'scripts' for body-end scripts.","message":"Order of scripts: 'headScripts' inserts before </head>, 'preHeadScripts' inserts after <head> but before other head scripts, 'scripts' inserts before </body>. Misunderstanding order leads to incorrect script positioning.","severity":"gotcha","affected_versions":"all"},{"fix":"For external scripts, use { src: 'url' } object; for inline code, use a string or { content: 'code' }.","message":"String-based scripts are not automatically wrapped in a script tag; they are injected as literal HTML. If you pass a plain string, it is inserted as raw HTML content inside a <script> tag. To include external src, use object syntax.","severity":"gotcha","affected_versions":"all"},{"fix":"Use 'typeof htmlPlugin extends (opts: infer T) => any ? T : never' or inspect the .d.ts file in node_modules.","message":"TypeScript users: the exported type name may not be 'HtmlConfigOptions' in v2.0.2; check the actual exported type from the package if you need strict typing.","severity":"gotcha","affected_versions":"2.0.2"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Run: npm install vite-plugin-html-config -D (or yarn/pnpm equivalent).","cause":"Plugin not installed or npm install failed.","error":"Failed to resolve import \"vite-plugin-html-config\" from \"vite.config.ts\". Does the file exist?"},{"fix":"Upgrade Vite to >=5.0.0, or downgrade plugin to v1.x (npm install vite-plugin-html-config@1).","cause":"Vite version mismatch: plugin v2.x requires Vite 5+.","error":"Error: The plugin 'vite-plugin-html-config' requires Vite >=5.0.0 but the current Vite version is 4.x.x."},{"fix":"Change import to: import htmlPlugin from 'vite-plugin-html-config' (default import).","cause":"Using a named import instead of default import.","error":"TypeError: htmlPlugin is not a function"},{"fix":"Use ESM syntax: import htmlPlugin from 'vite-plugin-html-config'. If your config is CJS, rename to .mjs or set type: module in package.json.","cause":"Using CommonJS require() for an ESM-only package.","error":"Unexpected token 'export' (in vite.config.js when using require)"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart

{"id":22687,"library":"vite-plugin-html-config","title":"vite-plugin-html-config","description":"A Vite plugin (v2.0.2) for injecting HTML tags (meta, link, script, style) into the index.html at build time. It uses Vite's transformIndexHtml hook and supports configurable head/body scripts with both string and object-based attributes. Unlike raw transformIndexHtml hooks, it provides a declarative, environment-aware API for conditionally adding tags. Requires Vite >=5.0.0. Currently in active development with support for Vite 3–5.","status":"active","version":"2.0.2","language":"javascript","source_language":"en","source_url":"https://github.com/ahwgs/vite-plugin-html-config","tags":["javascript","typescript"],"install":[{"cmd":"npm install vite-plugin-html-config","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-html-config","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-html-config","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency: requires Vite >=5.0.0 to function (transformIndexHtml hook).","package":"vite","optional":false}],"imports":[{"note":"ESM-only; no CommonJS export. Package type is not set, but Vite typically expects ESM.","wrong":"const htmlPlugin = require('vite-plugin-html-config')","symbol":"htmlPlugin","correct":"import htmlPlugin from 'vite-plugin-html-config'"},{"note":"Only a default export exists; named import will fail.","wrong":"import { htmlPlugin } from 'vite-plugin-html-config'","symbol":"vite-plugin-html-config (default export)","correct":"import htmlPlugin from 'vite-plugin-html-config'"},{"note":"Types are bundled, but the type name may not be exported explicitly in older versions. Check v2.0.2 types.","wrong":"","symbol":"htmlPlugin options type","correct":"import type { HtmlConfigOptions } from 'vite-plugin-html-config'"}],"quickstart":{"code":"// vite.config.js\nimport htmlPlugin from 'vite-plugin-html-config';\n\nexport default defineConfig({\n plugins: [\n htmlPlugin({\n title: 'My App',\n favicon: '/favicon.ico',\n metas: [\n { name: 'keywords', content: 'vite,plugin,html' },\n { name: 'description', content: 'A Vite plugin for HTML config' }\n ],\n links: [\n { rel: 'stylesheet', href: '/src/style.css' }\n ],\n headScripts: [\n { src: 'https://example.com/analytics.js', async: true }\n ],\n scripts: [\n 'console.log(\"body script\")'\n ],\n style: 'body { background: #f0f0f0; }'\n })\n ]\n});","lang":"javascript","description":"Demonstrates minimal configuration with all supported HTML injection options: title, favicon, metas, links, head/body scripts, and inline style."},"warnings":[{"fix":"Upgrade to Vite >=5.0.0 or use v1.x for older Vite (v2/v3).","message":"Vite 5+ peer dependency required. Plugin v2.x will not work with Vite 2.x or 3.x due to API changes in transformIndexHtml.","severity":"breaking","affected_versions":">=2.0.0 <2.0.0"},{"fix":"Migrate to explicit meta/link tags for title and favicon to avoid removal.","message":"Plugin options 'title' and 'favicon' may be deprecated in future versions; use 'metas' with and <link> tags instead.","severity":"deprecated","affected_versions":">=2.0.0"},{"fix":"Use 'preHeadScripts' for scripts that must run before other head scripts (e.g., polyfills), 'headScripts' for general head scripts, 'scripts' for body-end scripts.","message":"Order of scripts: 'headScripts' inserts before </head>, 'preHeadScripts' inserts after <head> but before other head scripts, 'scripts' inserts before </body>. Misunderstanding order leads to incorrect script positioning.","severity":"gotcha","affected_versions":"all"},{"fix":"For external scripts, use { src: 'url' } object; for inline code, use a string or { content: 'code' }.","message":"String-based scripts are not automatically wrapped in a script tag; they are injected as literal HTML. If you pass a plain string, it is inserted as raw HTML content inside a <script> tag. To include external src, use object syntax.","severity":"gotcha","affected_versions":"all"},{"fix":"Use 'typeof htmlPlugin extends (opts: infer T) => any ? T : never' or inspect the .d.ts file in node_modules.","message":"TypeScript users: the exported type name may not be 'HtmlConfigOptions' in v2.0.2; check the actual exported type from the package if you need strict typing.","severity":"gotcha","affected_versions":"2.0.2"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Run: npm install vite-plugin-html-config -D (or yarn/pnpm equivalent).","cause":"Plugin not installed or npm install failed.","error":"Failed to resolve import \"vite-plugin-html-config\" from \"vite.config.ts\". Does the file exist?"},{"fix":"Upgrade Vite to >=5.0.0, or downgrade plugin to v1.x (npm install vite-plugin-html-config@1).","cause":"Vite version mismatch: plugin v2.x requires Vite 5+.","error":"Error: The plugin 'vite-plugin-html-config' requires Vite >=5.0.0 but the current Vite version is 4.x.x."},{"fix":"Change import to: import htmlPlugin from 'vite-plugin-html-config' (default import).","cause":"Using a named import instead of default import.","error":"TypeError: htmlPlugin is not a function"},{"fix":"Use ESM syntax: import htmlPlugin from 'vite-plugin-html-config'. If your config is CJS, rename to .mjs or set type: module in package.json.","cause":"Using CommonJS require() for an ESM-only package.","error":"Unexpected token 'export' (in vite.config.js when using require)"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}