Как с помощью gulp правильно собрать js с учетом переменных среды?

Question

[Алексей Ярков]

Имеется фронтенд на Angular1. Есть сервис с методом, в котором жестко зашит URL API-сервера. Как с помощью gulp по феньшую собрать JS так, чтобы если переменная ENV == 'develop', то адрес сервера менялся на другой.
Я конечно могу тупо регуляркой заменить, но хочется правильно сделать.
Вот, например, для компиляции pug я с помощью gulp-data передаю в компилятор json с переменными. А как сделать с JS?

Answer 1

[Алексей Ярков]

Может звезды не так встали, но envify у меня не взлетел. Решил проблему так:

// /gulpfile.babel.js
fs.writeFileSync('./.env.json', JSON.stringify(process.env, ["NODE_ENV"]));

// /src/js/modules/App.API/factoryes/API.factory.js
(function () {
    'use strict';

        window.process = {env: require('../../.env.json')};

        if (process.env.NODE_ENV === "development") {
            self.url = "https://api.domain.dev";
        }
        else {
            self.url = "https://api.domain.ru";
        }

})();

Answer 2

[Константин Китманов]

Смотря чем собираете. Для webpack EnvironmentPlugin, для browserify -- envify, или даже проще с алиасами выкрутиться.

Comments

[Алексей Ярков]

Видимо envify то что нужно. Сейчас попробую. А что там с алиасами? Что вы имеете ввиду?

[Константин Китманов]

Алексей Ярков: с алиасами создаем два файла, dev.config.js и prod.config.js, а дальше в галп-тасках алиасим dev.config.js как config.js для девелоперской сборки и prod.config.js аналогично для релизной сборки. Чтобы в коде было написано require('config.js'), но в деве и проде подключались разные файлы.
Примерно как тут: https://benclinkinbeard.com/posts/mocking-environm..., с поправкой на галп вместо гранта.
Сорри за обилие жаргона:)