Конфигурационное имя файла Webpack, использующее квадратные скобки вместо простого текста - PullRequest
0 голосов
/ 06 мая 2018

В webpack.config.js, в output.filename Я вижу квадратные скобки. Что это значит? В чем разница между этим и обычным текстом?

output: {
    filename: '[name].js',

    // Webpack dev middleware, if enabled, handles requests for this URL prefix
    publicPath: 'dist/'
},

1 Ответ

0 голосов
/ 06 мая 2018

Это заполнители, которые Webpack заменит их фактическим значением.

Подробнее об этом вы можете прочитать в официальных документах: https://webpack.js.org/configuration/output/#output-filename.

Доступны следующие опции:

  • [hash]: хэш идентификатора модуля.
  • [chunkhash]: хэш содержимого чанка.
  • [name]: имя модуля.
  • [id]: идентификатор модуля.
  • [query]: запрос модуля, т. Е. Следующая строка?в имени файла.

Например, если ваша конфигурация Webpack выглядит следующим образом:

{
    entry : {
        a: '...',
        b: '...',
        c: '...'
    },


    output: {
        filename: '[name].js',
        publicPath: 'dist/'
    }
}

Webpack сгенерирует 3 выходных файла, по одному для каждого ключа внутри entry: a.js, b.js и c.js.

Разница между [hash] и [chunkhash] заключается в том, что первое генерируется для каждой сборки, а последнее генерируется для выходного файла.

Это имеет ряд преимуществ, например, если вы используете хеши в качестве кеш-буферов, возможно, вы создадите новую сборку, в которой изменяется только один из ваших файлов, но вы все равно заставите своих пользователей перезагружать их все,Если вы используете [chunkhash], только файл, который был изменен, будет загружен снова.

Кроме того, не забудьте использовать [chunkhash] в режиме разработки, так как это замедлит сборку.

...