{"id":20107,"library":"html-webpack-externals-plugin","title":"HTML Webpack Externals Plugin","description":"A Webpack plugin v3.8.0 (latest) that works alongside html-webpack-plugin to externalize specified module bundles, injecting script or link tags into the generated HTML. It automates the process of using pre-packaged vendor bundles (e.g., React, Lodash) via CDN or local files, reducing bundle size and improving caching. Unlike webpack's built-in externals, this plugin integrates directly with html-webpack-plugin to add the corresponding <script> or <link> tags. It requires html-webpack-plugin >=2.0.0 as a peer dependency. The plugin has been in maintenance mode with infrequent updates; last release was in 2019. Supports Node >=4.3.0.","status":"maintenance","version":"3.8.0","language":"javascript","source_language":"en","source_url":"https://github.com/mmiller42/html-webpack-externals-plugin","tags":["javascript","htmlwebpackplugin","webpack","html","externals"],"install":[{"cmd":"npm install html-webpack-externals-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add html-webpack-externals-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add html-webpack-externals-plugin","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency required for injecting externals into HTML output.","package":"html-webpack-plugin","optional":false}],"imports":[{"note":"This package uses CommonJS; no default ESM export is provided.","wrong":"import HtmlWebpackExternalsPlugin from 'html-webpack-externals-plugin';","symbol":"HtmlWebpackExternalsPlugin","correct":"const HtmlWebpackExternalsPlugin = require('html-webpack-externals-plugin');"},{"note":"There is no named export; the plugin is exported as a single constructor.","wrong":"import { HtmlWebpackExternalsPlugin } from 'html-webpack-externals-plugin';","symbol":"HtmlWebpackExternalsPlugin","correct":"import HtmlWebpackExternalsPlugin = require('html-webpack-externals-plugin');"},{"note":"TypeScript users should use `import = require()` syntax for CommonJS compatibility. The package does not ship its own type definitions.","wrong":"import * as HtmlWebpackExternalsPlugin from 'html-webpack-externals-plugin';","symbol":"HtmlWebpackExternalsPlugin (TypeScript)","correct":"import HtmlWebpackExternalsPlugin = require('html-webpack-externals-plugin');"}],"quickstart":{"code":"const HtmlWebpackPlugin = require('html-webpack-plugin');\nconst HtmlWebpackExternalsPlugin = require('html-webpack-externals-plugin');\n\nmodule.exports = {\n  entry: './src/index.js',\n  output: {\n    path: './dist',\n    filename: 'bundle.js'\n  },\n  plugins: [\n    new HtmlWebpackPlugin({\n      template: './src/index.html'\n    }),\n    new HtmlWebpackExternalsPlugin({\n      externals: [\n        {\n          module: 'react',\n          entry: 'https://unpkg.com/react@16/umd/react.production.min.js',\n          global: 'React'\n        },\n        {\n          module: 'react-dom',\n          entry: 'https://unpkg.com/react-dom@16/umd/react-dom.production.min.js',\n          global: 'ReactDOM'\n        }\n      ],\n      // Optional: hash the external URLs\n      hash: true,\n      // Optional: specify file type (js or css)\n      filetype: 'js'\n    })\n  ]\n};","lang":"javascript","description":"Configures webpack to externalize React and ReactDOM via CDN URLs, automatically adding script tags to HTML."},"warnings":[{"fix":"Use html-webpack-plugin v3.x or lower. For v4, consider using html-webpack-plugin's built-in script loading or other alternatives.","message":"Requires html-webpack-plugin >= 2.0.0 and < 4.0.0? Not specified but likely incompatible with v4.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Add `externals: { 'react': 'React', 'react-dom': 'ReactDOM' }` to your webpack config.","message":"The plugin does not automatically add externals to webpack's external config. You must still configure webpack externals manually.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Ensure consistency: the global name in the plugin entry, webpack externals, and the CDN script's object reference all match.","message":"The `global` property must match the global variable name expected by webpack externals and the actual script's global export.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Consider using `html-webpack-plugin`'s own `externals` option or manually adding scripts via template.","message":"The plugin has not been updated since 2019. It may not work with newer webpack versions (4/5).","severity":"deprecated","affected_versions":">=3.0.0"}],"env_vars":null,"search_vec":"'add':73 'alongsid':12 'autom':32 'built':60 'built-in':59 'bundl':21,41,51 'cach':55 'cdn':46 'correspond':75 'direct':66 'e.g':42 'extern':3,18,62 'file':49 'generat':29 'html':1,14,30,69 'html-webpack-plugin':13,68 'improv':54 'inject':22 'integr':65 'latest':9 'link':25 'local':48 'lodash':44 'modul':20 'packag':39 'plugin':4,7,16,64,71 'pre':38 'pre-packag':37 'process':34 'react':43 'reduc':50 'script':23 'size':52 'specifi':19 'tag':26 'unlik':56 'use':36 'v3.8.0':8 'vendor':40 'via':45 'webpack':2,6,15,57,70 'work':11","created_at":"2026-04-25T11:21:21.869518+00:00","updated_at":"2026-04-25T11:21:21.869518+00:00","problems":[{"fix":"Run `npm install html-webpack-externals-plugin --save-dev`","cause":"Package not installed or not resolved correctly.","error":"Error: Cannot find module 'html-webpack-externals-plugin'"},{"fix":"Use `const HtmlWebpackExternalsPlugin = require('html-webpack-externals-plugin');`","cause":"Incorrect import (e.g., using named import instead of default).","error":"TypeError: HtmlWebpackExternalsPlugin is not a constructor"},{"fix":"Ensure html-webpack-plugin is v3.x and webpack is v4.x. The plugin may not work with webpack 5.","cause":"Incompatible webpack or html-webpack-plugin version hooks.","error":"Error: HookWebpackError: Cannot read property 'tap' of undefined","affected_versions":">=3.5.0"}],"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/mmiller42/html-webpack-externals-plugin","docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/html-webpack-externals-plugin","openapi_spec":null,"status_page":null,"smithery":null,"categories":["web-framework","devops"],"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}}