laravel-mix/laravel-mix

Assets file name collision

Open

#3,061 建立於 2021年8月11日

在 GitHub 查看
 (9 留言) (0 反應) (0 負責人)JavaScript (5,221 star) (828 fork)batch import
enhancementhelp wanted

描述

I want to open this issue again with one more case https://github.com/JeffreyWay/laravel-mix/issues/2910 We have vue components and each component can have its own assets inside the components folder.

It was a matter of time when we come to a situation when two different components have two different images with the same name. Rename images? It's not a solution anyway.

For now, we use this temp workaround:

mix.extend('addHashToImagesFileNames', (webpackConfig) => {
  const imagesRule = webpackConfig.module.rules.find((rule) => {
    const { test } = rule;
    return test && typeof test.test === 'function' && test.test('.png');
  });

  if (!imagesRule) return;

  imagesRule.use.forEach(({ options }) => {
    if (options.name && typeof options.name === 'function') {
      options.name = (path) => {
        if (!/node_modules|bower_components/.test(path)) {
          return 'assets/images/[name].[hash:8].[ext]';
        }

        return (
          'assets/images/vendor/' +
          path
            .replace(/\\/g, '/')
            .replace(
              /((.*(node_modules|bower_components))|images|image|img|assets)\//g,
              ''
            ) +
          '?[hash]'
        );
      }
    }
  });
});
mix.addHashToImagesFileNames();

I have read the argument here https://github.com/JeffreyWay/laravel-mix/pull/2911#issuecomment-811079865 But why not do it optional? Just add addHashToFilenames option with default false value.

貢獻者指南

Assets file name collision · laravel-mix/laravel-mix#3061 | Good First Issue