如何将webpack的散列css文件实现到我的index.php中？

Question

我设置了一个Webpack配置，该配置使用MiniCssExtractPlugin将css编译成单个文件放入公用文件夹。

    new MiniCssExtractPlugin({
      filename: '[name].[contenthash].css'
    }),

最终文件看起来像这样：

styles.f14f755f197392ce2228.css

我还使用index.php文件，只是将其复制到公用文件夹中。

我现在的问题是：如何将散列的CSS文件包含在index.php文件中，而又不手动更改每个内部版本的名称？是否有某种辅助函数可以给我css文件的名称？

谢谢：）

Answer 1

我在wordpress中有一个读取散列CSS / JS的函数。您只需要适应它；）

function kodywig_matchFile($partOfName, $folder) {
  $handler = get_template_directory().'/assets/'.$folder;
  $openHandler = opendir($handler);
  while ($file = readdir($openHandler)) {
    if ($file !== '.' && $file !== '..') {
      if (preg_match("/^".$partOfName."\w+.(".$folder.")/i", $file, $name)) {
        return $name[0];
      }
    }
  }
  closedir($openHandler);
}

使用方法

echo '<link href="'. get_template_directory_uri() . '/assets/css/' . kodywig_matchFile('styles-', 'css') . '" rel="stylesheet">';