node.js 入口点 undefined = index.html 使用 HtmlWebpackPlugin

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/52013133/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-02 18:53:15  来源:igfitidea点击:

Entrypoint undefined = index.html using HtmlWebpackPlugin

node.jsreactjswebpackhtml-webpack-plugin

提问by xahovuzu

I'm using Webpack 4 and I'm creating the config file, when trying to use the HtmlWebpackPluginit 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?

我正在使用 Webpack 4 并且我正在创建配置文件,当尝试使用HtmlWebpackPlugin它时Entrypoint undefined = index.html,它在控制台上得到了这个:,它打开浏览器并且确实出现了 HTML 但我在控制台上收到了这个奇怪的消息,如何解决这个问题?

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
  ]
}

回答by Sakhi Mansoor

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.

如果 public 在 src 文件夹中,这应该可以工作这是我的假设。如果问题仍然存在,请告诉我。

回答by simlist

According to the creators of HtmlWebpackPluginit's just a meaningless log message and an ignorable cosmetic issue. See this commenton the issue.

根据创建者的说法,HtmlWebpackPlugin它只是一个毫无意义的日志消息和一个可忽略的外观问题。请参阅有关问题的评论

回答by AxeEffect

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 ejsbecause the template isn't valid htmlanymore:

如果你使用默认的 webpack 模板系统(EJS,从 webpack 4 开始),使用它是有意义的,ejs因为模板不再有效html

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.

webpack 默认认为模板是 EJS,并会自动使用适当的加载器进行处理。如果您使用任何其他模板系统,则必须添加相应的加载程序。有关官方文档的更多信息。