Question

我正在尝试为HtmlWebpackPlugin编写打字稿声明文件，但我无法使其正常工作。

HtmlWebpackPlugin默认导出是类HtmlWebpackPlugin的构造函数。我打算像这样使用它。

somefile.ts

import * as HtmlWebpackPlugin from 'html-webpack-plugin'
new HtmlWebpackPlugin({..some options...})

我尝试将其定义如下

shim.d.ts

/// <reference path="./shim.d.ts"/>
declare module 'html-webpack-plugin' {
  interface Options {
    title: string,
    filename: string,
    template: string,
    inject: (boolean | 'head' | 'body'),
    favicon: string,
    hash: boolean,
    cache: boolean,
    showErrors: boolean,
    chunks: any,
    chunksSortMode: ('none' | 'auto' | 'dependency'),
    excludeChunks: any,
    xhtml: boolean
  }
  class HtmlWebpackPlugin {
    constructor(options: Options);
  }
  export default ???
}

我想知道在这里填写???的内容。我尝试导出HtmlWebpackPlugin，typeof HtmlWebpackPlugin，但没有任何效果。它给了我以下类型错误。

Answer 1

你走了，

   export { HtmlWebpackPlugin };

   // or you may directly export class

   export class HtmlWebpackPlugin {
     constructor(options: Options);
   }

希望这会有所帮助!!

Answer 2

import * as Module from 'module'形式不再适用于AMD / CommonJS，以便与ES6模块（使用此表单导出整个命名空间）实现更好的互操作性。

解决方案：

默认情况下，使HtmlWebpackPlugin导出非模块实体。

declare module 'html-webpack-plugin' {
  interface Options {
    title: string,
    filename: string,
    template: string,
    inject: (boolean | 'head' | 'body'),
    favicon: string,
    hash: boolean,
    cache: boolean,
    showErrors: boolean,
    chunks: any,
    chunksSortMode: ('none' | 'auto' | 'dependency'),
    excludeChunks: any,
    xhtml: boolean
  }

  export = class HtmlWebpackPlugin {
    constructor(options: Options);
  }
}

使用所需的样式

导入它

import HtmlWebpackPlugin = require('html-webpack-plugin')

导出类的NodeJS模块的TypeScript声明

2 个答案: