如何从条目文件中的mini-css-extract-plugin获取对CSS文件的引用

Question

我在Webpack项目中使用mini-css-extract-plugin。配置是原始的：

 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
    plugins.push(new MiniCssExtractPlugin());
    sasscPlugins = [
      MiniCssExtractPlugin.loader,
      'css-loader',
      {
        loader: "sass-loader",
        options: {
          indentedSyntax: true,
          includePaths: [path.resolve(__dirname, 'src/assets/sass')]
        }
      }
    ];

这将创建main.css。然后webpack将main.css注入index.html。好吧，我想构建index.js并创建指向CSS文件的链接。这是我如何插入CSS文件的代码。

if (SEPARATE_CSS) {
    let head  = document.getElementsByTagName('head')[0];
    let link  = document.createElement('link');
    link.rel  = 'stylesheet';
    link.type = 'text/css';
    link.href = css_file as string; // how do I get this reference
    link.media = 'all';
    head.appendChild(link);
  }

我遇到的唯一问题是我不知道如何从entry.js文件获得对CSS文件的引用。我确定可以像./main.css一样对其进行硬编码，但是在这种情况下，publicPath将不起作用，并且哈希将不起作用。我知道我可以使用webpack.DefinePlugin将变量传递到条目文件，但是我不知道如何在其中插入CSS引用。