@ecar/html-webpack-plugin v0.0.6

@ecar/html-webpack-plugin

测试 webpack module test pattern 规则的 loader

install

npm install @ecar/html-webpack-plugin --save-dev
pnpm install @ecar/html-webpack-plugin --save-dev
yarn add @ecar/html-webpack-plugin -D

usage

const EcarHtmlWebpackPlugin = require('@ecar/html-webpack-plugin')

const configs = {
  plugins: [
    new EcarHtmlWebpackPlugin({
      src: '',
      tagName: 'script',
    }),
    // or
    // new EcarHtmlWebpackPlugin([
    //     {
    //       src: '',
    //       tagName: 'script',
    //     },
    //   ]),
  ],
}

Resources

html-webpack-plugin

Learning Ideas

TODO 理解html-webpack-plugin提供出来的钩子函数的处理时机，能用来做什么事情

beforeAssetTagGeneration hook

    AsyncSeriesWaterfallHook<{
      assets: {
        publicPath: string,
        js: Array<{string}>,
        css: Array<{string}>,
        favicon?: string | undefined,
        manifest?: string | undefined
      },
      outputName: string,
      plugin: HtmlWebpackPlugin
    }>

alterAssetTags hook

    AsyncSeriesWaterfallHook<{
      assetTags: {
        scripts: Array<HtmlTagObject>,
        styles: Array<HtmlTagObject>,
        meta: Array<HtmlTagObject>,
      },
      publicPath: string,
      outputName: string,
      plugin: HtmlWebpackPlugin
    }>

alterAssetTagGroups hook

    AsyncSeriesWaterfallHook<{
      headTags: Array<HtmlTagObject | HtmlTagObject>,
      bodyTags: Array<HtmlTagObject | HtmlTagObject>,
      publicPath: string,
      outputName: string,
      plugin: HtmlWebpackPlugin
    }>

afterTemplateExecution hook

    AsyncSeriesWaterfallHook<{
      html: string,
      headTags: Array<HtmlTagObject | HtmlTagObject>,
      bodyTags: Array<HtmlTagObject | HtmlTagObject>,
      outputName: string,
      plugin: HtmlWebpackPlugin,
    }>

beforeEmit hook

    AsyncSeriesWaterfallHook<{
      html: string,
      outputName: string,
      plugin: HtmlWebpackPlugin,
    }>

afterEmit hook

    AsyncSeriesWaterfallHook<{
      outputName: string,
      plugin: HtmlWebpackPlugin
    }>