webpack разные точки входа

Я хочу создать файлы index.html и card.html, в которые будут подключаться index.js и card.js соответсвенно. Ссылка на github

Но у меня получается так, что в каждом html файле подключаются все javascript файлы, а также весь css

<script type="text/javascript" src="index.js"></script>
<script type="text/javascript" src="card.js"></script>

webpack.config.js:

const path = require('path');
const fs = require('fs');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');

const getFiles = function (dir, files_){
  files_ = files_ || [];
    var files = fs.readdirSync(dir);
    for (var i in files){
        var name = dir + '/' + files[i];
        if (fs.statSync(name).isDirectory()){
            getFiles(name, files_);
        } else {
            files_.push(name);
        }
    }
    return files_;
};

const pathSrc = path.resolve(__dirname, 'src');
const pages = getFiles(pathSrc)
  .filter((item) => path.extname(item) === '.html');


module.exports = {
  context: path.resolve(__dirname, 'src'),
  entry: {
    index: './index/index',
    card: './card/card'
  },
  output: {
    path: path.join(__dirname, '/dist'),
    filename: '[name].js',
    library: '[name]'
  },
  devServer: {
    port: 3000
  },
  plugins: [
    ...pages.map(page => {
      return new HtmlWebpackPlugin({
        template: page,
        filename: path.basename(page)
      })
    }),
    new CleanWebpackPlugin()
  ],
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      }
  ]
  }
};