{"id":22696,"library":"vite-plugin-html","title":"vite-plugin-html","description":"Vite plugin for minifying HTML and executing lodash.template syntax in index.html. Current version 3.2.2 works with Vite 2.0+. It allows dynamic HTML content via template placeholders, CSS/JS injection, and HTML minification. Unlike alternative HTML plugins (e.g., vite-plugin-html-minifier), it provides full lodash.template support. The plugin ships TypeScript types. Release cadence is irregular; breaking changes may occur between major versions.","status":"active","version":"3.2.2","language":"javascript","source_language":"en","source_url":"https://github.com/vbenjs/vite-plugin-html","tags":["javascript","vite","html","minify","vite-plugin","typescript"],"install":[{"cmd":"npm install vite-plugin-html","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-html","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-html","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency; plugin only works with Vite >=2.0.0","package":"vite","optional":true}],"imports":[{"note":"ESM-only; CommonJS require fails. Named export (not default).","wrong":"const vitePluginHtml = require('vite-plugin-html')","symbol":"vitePluginHtml","correct":"import { vitePluginHtml } from 'vite-plugin-html'"},{"note":"Function is exported as a named export. Default import is a different shape.","wrong":"import createHtmlPlugin from 'vite-plugin-html'","symbol":"createHtmlPlugin","correct":"import { createHtmlPlugin } from 'vite-plugin-html'"},{"note":"Deprecated in v3. Use named import createHtmlPlugin. Default export may be removed in future.","wrong":"const { vitePluginHtml } = require('vite-plugin-html')","symbol":"vitePluginHtml (default)","correct":"import vitePluginHtml from 'vite-plugin-html'"}],"quickstart":{"code":"import { defineConfig } from 'vite';\nimport { createHtmlPlugin } from 'vite-plugin-html';\n\nexport default defineConfig({\n  plugins: [\n    createHtmlPlugin({\n      minify: true,\n      template: 'index.html',\n      inject: {\n        data: {\n          title: 'My App',\n          injectScript: '<script src=\"/inject.js\"></script>',\n        },\n      },\n    }),\n  ],\n});","lang":"typescript","description":"Basic Vite config using createHtmlPlugin to minify HTML and inject data via lodash.template."},"warnings":[{"fix":"Use import { createHtmlPlugin } from 'vite-plugin-html' instead.","message":"v3: default export renamed to createHtmlPlugin; vitePluginHtml deprecated.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Review docs for v2 option changes; migrate inject scripts to 'inject' object.","message":"v2: changed plugin options shape; some options now nested under 'inject'.","severity":"breaking","affected_versions":">=2.0.0 <3.0.0"},{"fix":"Switch to named export createHtmlPlugin.","message":"v3 deprecated default export; will be removed in v4.","severity":"deprecated","affected_versions":">=3.0.0"},{"fix":"Use separate plugins or custom logic for multiple HTML files.","message":"Plugin only processes index.html; other HTML files not affected.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Preprocess data outside plugin or use simpler templating.","message":"lodash.template syntax can be slow for large inject data; consider limiting.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"search_vec":"'2.0':22 '3.2.2':18 'allow':24 'altern':37 'break':60 'cadenc':57 'chang':61 'content':27 'css/js':31 'current':16 'dynam':25 'e.g':40 'execut':11 'full':48 'html':4,9,26,34,38,44,69 'index.html':15 'inject':32 'irregular':59 'javascript':67 'lodash.template':12,49 'major':65 'may':62 'minif':35 'minifi':8,45,70 'occur':63 'placehold':30 'plugin':3,6,39,43,52,73 'provid':47 'releas':56 'ship':53 'support':50 'syntax':13 'templat':29 'type':55 'typescript':54,74 'unlik':36 'version':17,66 'via':28 'vite':2,5,21,42,68,72 'vite-plugin':71 'vite-plugin-html':1 'vite-plugin-html-minifi':41 'work':19","created_at":"2026-04-27T17:06:31.268245+00:00","updated_at":"2026-04-27T17:06:31.268245+00:00","problems":[{"fix":"Change import to: import { createHtmlPlugin } from 'vite-plugin-html'","cause":"Using default import in v3; default export is deprecated and may be undefined.","error":"TypeError: (0 , vite_plugin_html_1.default) is not a function"},{"fix":"Run: npm install vite-plugin-html --save-dev","cause":"Package not installed or wrong version.","error":"Error: Cannot find module 'vite-plugin-html'"},{"fix":"Use import() or set type: 'module' in package.json.","cause":"Using require() on an ESM-only package.","error":"ERR_REQUIRE_ESM from CJS require()"}],"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/vbenjs/vite-plugin-html","docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/vite-plugin-html","openapi_spec":null,"status_page":null,"smithery":null,"categories":["web-framework","serialization"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-18","next_check":"2026-07-26","install_tag":null}}