Registry / devops / webpack-external-plugin

webpack-external-plugin

library1.1.3jsnpmunverified

A webpack plugin that generates a script to load all chunks and externals into HTML. Version 1.1.3 supports webpack 4. It creates load files per entry point, including CSS assets, and integrates with html-webpack-plugin. Unlike other external loaders, it automatically resolves external library versions from node_modules and supports custom CDN paths via string or function. The plugin is intended for production use only and has unchanged API since v1.0.

devops

npm install webpack-external-plugin

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · WEBPACK-EXTERNAL-P

webpack-external-plugin

devopsjavascriptv1.1.3

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

WebpackExternalPlugin

✓ const WebpackExternalPlugin = require('webpack-external-plugin');

✗ import WebpackExternalPlugin from 'webpack-external-plugin';

Package does not ship ESM; use CommonJS require.

new WebpackExternalPlugin({...})

✓ new WebpackExternalPlugin({ filename: 'load.js', cdnPath: '...' })

✗ new WebpackExternalPlugin()

Options object is optional but commonly misconfigured (e.g., empty constructor).

filename option

✓ new WebpackExternalPlugin({ filename: 'load-[name].js' })

✗ new WebpackExternalPlugin({ filename: '[name].js' })

Avoid filename collision with webpack output filename; default uses 'load-' prefix.

Creates a webpack config using WebpackExternalPlugin to generate a load script that includes externals (React, ReactDOM) from CDN and the main bundle. Outputs 'load-bundle.js' in dist folder.

// webpack.config.js const WebpackExternalPlugin = require('webpack-external-plugin'); const path = require('path'); module.exports = { mode: 'production', entry: './src/index.js', output: { path: path.resolve(__dirname, 'dist'), filename: 'bundle.js', publicPath: '/', }, externals: { react: 'React', 'react-dom': 'ReactDOM', }, plugins: [ new WebpackExternalPlugin({ filename: 'load-bundle.js', cdnPath: 'https://unpkg.com/[package]@[version]', }), ], };

Debug

Known issues

breakingfilename collision: Do not set filename same as webpack output file name (e.g., both '[name].js')

fix

Use a distinct filename pattern, e.g., 'load-[name].js'.

affects: >=1.0.0

deprecatedWebpack 5 is not supported; plugin targets webpack 4 only.

fix

Stay on webpack 4 or migrate to an alternative plugin.

affects: >=1.0.0

gotchaPlugin only intended for production; using in development may cause unexpected behavior.

fix

Ensure mode is 'production' or conditionally add plugin only in production builds.

affects: >=1.0.0

gotchaExternals must be declared in webpack config for plugin to generate CDN links.

fix

Add externals to webpack config as object mapping package name to global variable.

affects: >=1.0.0

gotchacdnPath function: custom CDN list must return full URL string for each package.

fix

Ensure function returns a string URL; do not omit parameters.

affects: >=1.0.0

breakingChunk filenames ending with .map are excluded; source maps not loaded.

fix

Set devtool false for production builds to avoid source maps being excluded.

affects: >=1.0.0

Errors

Common errors & fixes

TypeError: Cannot read property 'compilation' of undefined

Plugin applied in development mode without proper webpack setup.

fix

Ensure webpack is version 4 and plugin is added in a correct environment (production).

Error: webpack-external-plugin only supports webpack 4

Using webpack 5 or older version.

fix

Downgrade to webpack 4 or use a different plugin that supports webpack 5.

Output file 'load-[name].js' conflicts with webpack output file '[name].js'

Filename option matches webpack output.filename pattern.

fix

Change plugin filename to include a unique prefix like 'load-'.

EXTERNAL: react failed to load from CDN

CDN path misconfiguration or missing version resolution.

fix

Check node_modules for react version; ensure cdnPath is correct.

Upgrade

Version history

1.1.3latest on npm

Audit

Dependencies

webpackrequiredpeer dependency required for plugin to function

Agent activity

2 hits · last 30 days

node

Resources

githubhttps://github.com/yeliex/webpack-external-plugin ↗

packagewebpack-external-plugin ↗

homepagehttps://github.com/yeliex/webpack-external-plugin#readme ↗