Как создать уникальное имя файла с помощью веб-пакета?

Question

У меня есть конфигурация конфигурации веб-пакета, я хотел бы генерировать уникальное имя файла, например, name123fr, каждый раз, когда я запускаю nmp run build, вот часть моего кода

return [{
        entry: './src/main.js',
        output: {
            filename: 'widget.js',
            path: path.resolve(bundleOutputDir),
        }
}]

Это генерирует мне следующий файл: http://localhost: 8080 / widget. js

Но я хочу что-то вроде этого http://localhost: 8080 / widget23we23. js

имя должно быть уникальным каждый раз, когда я запускаю `npm run build '

возможно ли это с помощью веб-пакета?

Answer 1

В веб-пакете документации по кэшированию рекомендуется использовать замену [contenthash]:

Подстановка [contenthash] добавит уникальный ha sh на основе содержимого актив. Когда меняется содержимое ресурса, [contenthash] также меняется.

вот пример того, как это будет выглядеть в вашем фрагменте кода сверху:

const HtmlWebpackPlugin = require('html-webpack-plugin');
// ...
return [{
  entry: './src/main.js',
  plugins: [
    new HtmlWebpackPlugin({ title: 'Caching' }),
  ],
  output: {
    filename: 'widget.[contenthash].js',
    path: path.resolve(bundleOutputDir),
  }
}]

Вывод должно быть примерно таким:

widget.7e2c49a622975ebd9b7e.js

Это не будет делать именно то, что вы просите, потому что имя не будет меняться при каждой перезагрузке. Но это приведет к изменению имени файла при изменении кода, и я подозреваю, что это ваш желаемый результат.