当涉及到 TypeScript 时，webpack 配置函数的类型是什么？

Question

使用 TypeScript 编写配置时，我无法确定 webpack 配置函数的类型。

目前我导出了一个类型为Configuration的对象：

const config: Configuration = {
  mode: 'production',
  // ...
}
export default config;

应该改为导出函数：

export default (...): ... => {
  return {
    mode: 'production'
    // ...
  }
}

但我不知道该函数的正确类型，也无法在类型定义中找到它：

https://github.com/webpack/webpack/blob/main/types.d.ts

有什么想法吗？

Answer 1

目前似乎没有成熟或推荐的解决方案。

与此同时，我所做的是这个。

webpack.types.ts:

import type { Configuration } from "webpack";
import type { Configuration as DevServerConfiguration } from "webpack-dev-server";

export interface WebpackConfiguration extends Configuration {
  devServer?: DevServerConfiguration;
}

type CLIValues = boolean | string;

type EnvValues = Record<string, CLIValues | Record<string, Env>>;

interface Env extends EnvValues {}

type Argv = Record<string, CLIValues>;

export interface WebpackConfigurationGenerator {
  (env?: Env, argv?: Argv): Configuration | Promise<Configuration>;
}

webpack.config.ts

import type { WebpackConfigurationGenerator } from "./webpack.types";

const generateConfig: WebpackConfigurationGenerator = (env, argv) => {
  // ...
};

export default generateConfig;