TypeScript: `exports` field in `package.json` missing a `types` field (required even if there is already a top level "types" field)

[davidmurdoch]

Current behaviour

importing html-bundler-webpack-plugin causes typescript error:

Could not find a declaration file for module 'html-bundler-webpack-plugin'. '/home/david/code/test/empty/node_modules/html-bundler-webpack-plugin/src/index.js' implicitly has an 'any' type. Try npm i --save-dev @types/html-bundler-webpack-plugin if it exists or add a new declaration (.d.ts) file containing declare module 'html-bundler-webpack-plugin';ts(7016)

Expected behaviour

Types should work in latest typescript with "module": "node16" and "strict": true.

Here is some information about how typescript resolves types fields: https://www.typescriptlang.org/docs/handbook/modules/reference.html#packagejson-typesversions

I think you need to add a "types" field to the "exports" in the package.json. Something like (but I'm not entirely sure this is 100% correct):

  "exports": {
-   ".": "./src/index.js",
+   ".": {
+     "require": "./src/index.js",
+     "import": "./src/index.js",
+     "types": "./types.d.ts"
+   },
    "./plugins": "./plugins/index.js",
    "./plugins/favicons-bundler-plugin": {
      "types": "./plugins/favicons-bundler-plugin/index.d.ts",
      "require": "./plugins/favicons-bundler-plugin/index.js",
      "import": "./plugins/favicons-bundler-plugin/index.js"
    }
  },

Reproduction Example

Create the 3 files below then run yarn && npx -y tsc.

// package.json
{
  "private": true,
  "devDependencies": {
    "html-bundler-webpack-plugin": "^3.5.1",
    "typescript": "^5.3.3",
    "webpack": "^5.90.3"
  }
}

//webpack.config.ts
import HtmlBundlerPlugin from 'html-bundler-webpack-plugin';

export default {
    plugins: [
        new HtmlBundlerPlugin()
    ]
}

// tsconfig.json
{
    "compilerOptions": {
      "module": "node16",
      "strict": true
    }
  }

Environment

• OS: Ubuntu
• version of Node.js: 20.11.0
• version of Webpack: 5.90.3
• version of the Plugin: 3.5.1

Additional context

n/a

[webdiscus]

Hello @davidmurdoch,

Thank you for the issue report and the solution!

The fixed version is 3.5.2.

I have added the fields require, import, types into the exports section of the package.json. This just works fine, but I got another error: TS1479 by import { Options as MinifyOptions } from 'html-minifier-terser';

To fix it you should use following TS options:

// tsconfig.json
{
  "compilerOptions": {
    "strict": true,
    "module": "es2020",
    //"module": "node16", /* ERROR TS1479 by import { Options as MinifyOptions } from 'html-minifier-terser'; */

    "moduleResolution": "node",
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true
  }
}