當 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