webpack-dll-bundles-plugin

1.0.0-beta.5 verified Sat Apr 25 auth: no javascript deprecated

A Webpack plugin that automates creation of DLL bundles using Webpack's DllPlugin and DllReferencePlugin. This package (v1.0.0-beta.5) is an early beta release; it simplifies splitting vendor/polyfill code into separate DLL files, monitors package changes for rebuilds, and provides a resolveFile helper. It is intended for Webpack 3/4 but has known issues with newer versions. Development appears stalled, with no updates since 2017. Alternatives: hard-source-webpack-plugin or Webpack's built-in cache.

Common errors

error Module not found: Error: Can't resolve 'webpack-dll-bundles-plugin' ↓

cause Package missing after npm install; possibly not installed or wrong version.

fix

Run 'npm install webpack-dll-bundles-plugin@1.0.0-beta.5 --save-dev'

error TypeError: DllBundlesPlugin is not a constructor ↓

cause Incorrect import style; default import may not be a function.

fix

Use 'const DllBundlesPlugin = require('webpack-dll-bundles-plugin');'

error Error: DllBundlesPlugin requires webpackConfig ↓

cause Missing webpackConfig property in plugin options.

fix

Add 'webpackConfig' to the options object (path or config object).

Warnings

deprecated Plugin is unmaintained and incompatible with Webpack 5; use at your own risk. ↓

fix Consider using hard-source-webpack-plugin or Webpack's built-in persistent caching.

gotcha The plugin overrides webpackConfig entry and adds DllPlugin automatically; custom entry in webpackConfig will be ignored. ↓

fix Define bundles in the plugin config, not in the base webpack config.

gotcha resolveFile() returns a filename with a specific template that may change; do not hardcode DLL filenames. ↓

fix Always use DllBundlesPlugin.resolveFile() to get DLL filenames.

gotcha The plugin may not automatically rebuild DLLs when packages update; watch functionality is listed as TODO. ↓

fix Manually trigger rebuild or watch using webpack --watch.

Install

npm install webpack-dll-bundles-plugin

yarn add webpack-dll-bundles-plugin

pnpm add webpack-dll-bundles-plugin

Imports

DllBundlesPlugin

wrong

import DllBundlesPlugin from 'webpack-dll-bundles-plugin';

correct

const DllBundlesPlugin = require('webpack-dll-bundles-plugin');

Package uses CommonJS; ES module import may fail in Node environments.

resolveFile
wrong
```
resolveFile('polyfills')
```
correct
```
DllBundlesPlugin.resolveFile('polyfills')
```
resolveFile is a static method on DllBundlesPlugin, not a standalone export.
DllBundlesPlugin
```
const { DllBundlesPlugin } = require('webpack-dll-bundles-plugin');
```
Destructured require works because the plugin exports an object with the constructor.

Quickstart

Creates DLL bundles for polyfills and vendor libraries, merging a common webpack config.

const DllBundlesPlugin = require('webpack-dll-bundles-plugin');
const webpackMerge = require('webpack-merge');
const commonConfig = require('./webpack.common.js');

module.exports = {
  plugins: [
    new DllBundlesPlugin({
      bundles: {
        polyfills: ['core-js', 'zone.js'],
        vendor: ['react', 'react-dom']
      },
      dllDir: './dll',
      webpackConfig: webpackMerge(commonConfig, {
        devtool: 'cheap-module-source-map',
        plugins: []
      })
    })
  ]
};