当 webpack 服务器运行时，如何运行不同的 html 文件而不是 index.html？

Question

当我运行 webpack 服务器时，默认情况下，下面的配置会打开公共文件夹中的 index.html。 所以，而不是 index.html，我想创建另一个。html 或者可能就像一个文件夹，里面有一个 html 例如。 public/someFolder/another.html 并想在 webpack 服务器运行时打开它。

当 webpack 服务器运行时，如何运行不同的 html 文件而不是 index.html？

webpack.config.js

const path = require("path");
module.exports = {
  entry: "./myFile.js",
  output: {
    path: path.join(__dirname, "public"),
    filename: "bundle.js",
  },
  module: {
    rules: [
      {
        loader: "babel-loader",
        test: /\.js$/,
        exclude: /node_modules/,
      },
      {
        test: /\.s?css$/,
        use: ["style-loader", "css-loader", "sass-loader"],
      },
    ],
  },
  devtool: "cheap-module-eval-source-map",
  devServer: {
    contentBase: path.join(__dirname, "public"),
    historyApiFallback: true,
  },
};

Answer 1

看看HtmlWebpackPlugin

您可以指定自定义路径和 custom.html 文件。

  output: {
    filename: './dist/subdirectory/myindex.html'
  },
  plugins: [new HtmlWebpackPlugin()]

默认当然是index.html