CODEWITHSUNDEEP
node.jsreactjswebpackhtml-webpack-plugin
xahovuzu
xahovuzu

Reputation: 361

Entrypoint undefined = index.html using HtmlWebpackPlugin

I'm using Webpack 4 and I'm creating the config file, when trying to use the HtmlWebpackPlugin it got this on the console: Entrypoint undefined = index.html, it opens the browser and the HTML does appear but I'm getting this weird message on the console, how to solve this?

That is how my config file looks like:

'use strict'

const webpack = require('webpack')
const { join, resolve } = require('path')

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

module.exports = {
  mode: 'development', // dev
  devtool: 'cheap-module-eval-source-map', // dev
  entry: join(__dirname, 'src', 'index.js'),
  output: {
    filename: 'bundle.js',
    path: resolve(__dirname, 'dist')
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader'
      }
    ]
  },
  resolve: {
    extensions: ['*', '.js', '.jsx']
  },
  devServer: {
    contentBase: resolve(__dirname, 'build')
  },
  plugins: [
    new webpack.ProgressPlugin(),
    new HtmlWebpackPlugin({
      template: join(__dirname, 'public', 'index.html')
    }),

    new webpack.HotModuleReplacementPlugin(), // dev
    new webpack.NoEmitOnErrorsPlugin() // dev
  ]
}

Upvotes: 33

Views: 41202

Answers (5)

Muskan Tripathi
Muskan Tripathi

Reputation: 23

Error got fixed in mine by adding this in webpack.config.js :

    stats: { children: false }, //to fix the error-Entrypoint undefined=index.html  
      plugins:[  
          new HtmlWebpackPlugin({  
             template: './index.html'  
          })  
      ]

Upvotes: 0

Mohammad Ayoub Khan
Mohammad Ayoub Khan

Reputation: 2960

plugins: [
      ...
      new HtmlWebPackPlugin({
        title: '...',
        template: path.resolve(folderSrc, 'index.html'),
        filename: 'index.html',
        hash: true
      })
    ]

Upvotes: 0

simlist
simlist

Reputation: 159

According to the creators of HtmlWebpackPlugin it's just a meaningless log message and an ignorable cosmetic issue. See this comment on the issue.

Upvotes: 5

AxeEffect
AxeEffect

Reputation: 7461

It seems like a problem with the extension of the template firing an unwanted loader. If the extension of the template is changed to any other the plugin will work.

If you're using the default webpack template system (EJS, as of webpack 4) it makes sense to use ejs because the template isn't valid html anymore:

new HtmlWebpackPlugin({
    // it works without 'path.resolve()'. No need for 'filename', defaults to 'index.html'
    template: "./public/index.ejs",
}),

webpack considers by default that the template is EJS and will automatically process it with the proper loader. If you use any other template system you will have to add the corresponding loader. More info on official documentation.

Upvotes: 0

Sakhi Mansoor
Sakhi Mansoor

Reputation: 8102

Try this; you might be making wrong template path :

 new HtmlWebpackPlugin({
        template: resolve(__dirname, 'src/public', 'index.html'),
        filename: './index.html'
      }),

If public is in src folder this should work It's my assumption. Let me know if the issue still persists.

Upvotes: 7

Related Questions