Webpack 4 Declaration Bundler Plugin

Common errors

• Module not found: Error: Can't resolve 'declaration-bundler-webpack-plugin' in '...'

  cause The plugin package is not installed as a dependency in your project.
  fix Run `npm install declaration-bundler-webpack-plugin --save-dev` or `yarn add declaration-bundler-webpack-plugin --dev`.

• TypeError: DeclarationBundlerPlugin is not a constructor

  cause Incorrect import syntax for a CommonJS module, or issues with how `require` resolves the module, leading to attempting to call `new` on a non-constructor.
  fix Ensure you are using `const DeclarationBundlerPlugin = require('declaration-bundler-webpack-plugin');` as the plugin exports as a CommonJS module and is not designed for ES module `import` syntax.

• ERROR in DeclarationBundlerPlugin: No declaration files found to bundle. Please ensure 'ts-loader' is configured to generate '.d.ts' files.

  cause `ts-loader` is not configured to generate individual TypeScript declaration files (`.d.ts`), or `declaration: true` is missing in your `tsconfig.json`.
  fix Verify that `ts-loader` is properly set up in your Webpack configuration and that `declaration: true` is enabled within your `tsconfig.json` file to produce the necessary `.d.ts` artifacts.

Warnings

• gotcha This plugin is designed for a very specific use case involving exposing external modules as internal TypeScript modules in a global namespace. It is explicitly stated in the documentation that it is not useful if your project adheres to standard internal or external module patterns.
  Fix: Carefully evaluate if your module exposure strategy aligns with the plugin's 'internal module' emulation. For typical TypeScript projects, a different declaration bundling approach is likely needed.
• breaking This plugin is explicitly for Webpack 4. It is highly unlikely to be compatible with Webpack 5 or newer versions due to significant breaking changes in Webpack's API and plugin architecture.
  Fix: If using Webpack 5 or later, this plugin is unsuitable. Seek an alternative declaration bundling solution compatible with your Webpack version.
• gotcha The plugin requires `ts-loader` to be configured with `declaration: true` in your `tsconfig.json` (or equivalent) to generate individual `.d.ts` files for each source file, which it then bundles. Without these individual declaration files, the plugin will have no declarations to process.
  Fix: Ensure `ts-loader` is correctly set up in your Webpack configuration and `declaration: true` is enabled in your `tsconfig.json` to produce the necessary `.d.ts` artifacts.
• deprecated The package is in beta (1.0.6-beta.2) and has seen no updates since early 2020. Its original upstream project (`smol/declaration-bundler-webpack-plugin`) is archived. This indicates the plugin is abandoned and not actively maintained, posing a risk for future compatibility, security, and bug fixes.
  Fix: Consider migrating to actively maintained declaration bundling solutions or be prepared to fork and maintain this plugin yourself if its niche functionality is critical to your project and no alternatives exist.

Install

• npm install declaration-bundler-webpack4-plugin npm
• yarn add declaration-bundler-webpack4-plugin yarn
• pnpm add declaration-bundler-webpack4-plugin pnpm

Imports

• DeclarationBundlerPlugin
  wrong:

  import DeclarationBundlerPlugin from 'declaration-bundler-webpack-plugin';
  import { DeclarationBundlerPlugin } from 'declaration-bundler-webpack-plugin';

  correct:

  const DeclarationBundlerPlugin = require('declaration-bundler-webpack-plugin');

  This plugin is designed for CommonJS environments, reflecting its age and Webpack 4 context. It does not support ESM imports.

Quickstart

Demonstrates a basic Webpack 4 configuration using `ts-loader` to compile TypeScript and `DeclarationBundlerPlugin` to consolidate generated `.d.ts` files into a single, internal-module-like declaration file, `bundle.d.ts`.

const path = require('path');
const DeclarationBundlerPlugin = require('declaration-bundler-webpack-plugin');

module.exports = {
    entry: './src/init.ts', // Assumes entry files like src/init.ts, src/foo.ts, src/foo2.ts as per README
    output: {
        filename: './builds/bundle.js',
        path: path.resolve(__dirname, 'dist') // Using path.resolve for output directory
    },
    resolve: {
        extensions: ['.ts', '.tsx', '.js'] // Modern usage, simplified from README for clarity
    },
    module: {
        rules: [ // 'loaders' is deprecated, 'rules' is current for Webpack 4+
            { test: /\.ts(x?)$/, loader: 'ts-loader' }
        ]
    },
    watch: false, // Set to false for a typical build, README shows true
    plugins: [
        new DeclarationBundlerPlugin({
            moduleName:'some.path.moduleName',
            out:'./builds/bundle.d.ts'
        })
    ]
};