TypeError: Cannot read property 'tap' of undefined

[azhengyongqin]

Current behaviour 💣

TypeError: Cannot read property 'tap' of undefined

PS C:\Users\Administrator\Documents\ts_in_action> yarn run start
yarn run v1.22.5
$ webpack-dev-server --mode=development --config ./build/webpack.config.js
TypeError: Cannot read property 'tap' of undefined
    at HtmlWebpackPlugin.apply (C:\Users\Administrator\Documents\ts_in_action\node_modules\html-webpack-plugin\index.js:40:31)
    at webpack (C:\Users\Administrator\Documents\ts_in_action\node_modules\webpack\lib\webpack.js:51:13)
    at startDevServer (C:\Users\Administrator\Documents\ts_in_action\node_modules\webpack-dev-server\bin\webpack-dev-server.js:94:16)        
    at C:\Users\Administrator\Documents\ts_in_action\node_modules\webpack-dev-server\bin\webpack-dev-server.js:166:3
    at C:\Users\Administrator\Documents\ts_in_action\node_modules\webpack-dev-server\lib\utils\processOptions.js:33:9
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

package.json ☀️

"scripts": {
        "start": "webpack-dev-server --mode=development --config ./build/webpack.config.js",
        "dev": ""
    },
    "license": "MIT",
    "devDependencies": {
        "@babel/core": "^7.15.5",
        "@babel/preset-env": "^7.15.6",
        "babel-loader": "^8.2.2",
        "clean-webpack-plugin": "^4.0.0",
        "html-webpack-plugin": "^5.3.2",
        "ts-loader": "^9.2.5",
        "typescript": "^4.4.3",
        "webpack": "^5.52.1",
        "webpack-cli": "^4.8.0",
        "webpack-dev-server": "^4.2.0",
        "webpack-merge": "^5.8.0"
    }

webpack.config.js 👾

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

module.exports = {
    entry: {
        'app': './src/index.jsx'
    },
    output: {
        filename: '[name].[chunkhash:8].js'
    },
    resolve: {
        extensions: ['.js', '.jsx', 'ts']
    },
    module: {
        rules: [
            {
                test: /\.jsx?$/,
                use: [{
                    loader: 'babel-loader'
                }],
                exclude: /node_modules/
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: './src/tpl/index.html'
        })
    ],
    optimization: {
        splitChunks: {
            chunks: 'all'
        }
    }
}

[alexander-akait]

Run npm ls webpack

[jackstine]

Got the same issue, changing "html-webpack-plugin" from "^5.5.0", to "^4.0.0", worked. I had another version of webpack though.

here is my devDependencies

"devDependencies": { "bootstrap": "^4.3.1", "css-loader": "^2.1.0", "html-webpack-plugin": "^4.0.0", "node-sass": "^4.11.0", "sass-loader": "^7.1.0", "style-loader": "^0.23.1", "webpack": "^4.29.6", "webpack-cli": "^3.2.3" }

[stale[bot]]

This issue had no activity for at least half a year. It's subject to automatic issue closing if there is no activity in the next 15 days.

[romelperez]

I just downgraded to from v5.5 to version v5.4 and it worked.

[alexander-akait]

Close in favor https://github.com/jantimon/html-webpack-plugin/issues/1617, please run npm ls webpack and check you have webpack v5 eveywhere