Способен ли Webpack при сборке менять пути API?

Question

[Александр]

Интересует вопрос: как можно организовать сборку проекта webpack, при которой бы менялись пути обращения к API.
Сейчас все пути я беру из одного файла, можно ли организовать сборку таким образом, чтобы все собранные модули видели другой файл с другими путями?

Answer 1

[Олег Драпеза]

Вы можете добавлять пути как параметры при билде.

В конфиге:

const API = process.env.api;

module.exports = {
    ...,
    plugins: [
        ...,
        new webpack.DefinePlugin({
            API_URL: JSON.stringify(API)
        })
    ]
}

И глобальная переменная API_URL будет доступна в коде вашего проекта.

Условный конфиг для сборки в вашем package.json:

{
  "scripts": {
    "build": "webpack --env.api=https://api.url/v1"
  }
}

Если надо на лету добавить:
npm run build -- --env.api=https://api.url/v2

Answer 2

[Антон Антон]

ИМХО правильно сделать так - файл, содержащий пути, добавить в .gitignore, потом на продакшене/тестовом/своем сервере делать сборку индивидуально. Ну, или не в .gitignore, а в ветку "мастер", и не переносить в эту ветку изменения этого файла при слиянии (это несколько более заморочно). Делать сборку у себя и копировать на прод - неправильно.