Блог

У меня есть следующий файл переключения функций:

 export const featureToggles = {
  FEATURE_EXAMPLE: (process.env.FEATURE_EXAMPLE === 'true')
};
  

который в моем выводе Browserify становится

 "use strict";Object.defineProperty(exports, "__esModule", { value: true });exports.featureToggles = void 0;const featureToggles = {
  FEATURE_EXAMPLE: process.env.FEATURE_EXAMPLE === 'true' };exports.featureToggles = featureToggles;
  

Когда я использую свое универсальное приложение React featureToggles , я получаю правильный ответ от сервера, но клиент перезаписывает при увлажнении. В результате новая функция с сервера заменяется старой функцией при гидратации клиента.

Мой скрипт Browserify выглядит следующим образом (этот фрагмент будет повторяться несколько раз ниже с небольшими изменениями, основанными на том, что я пробовал):

 const envify = require('envify/custom');

// function declarations etc
  browserify()
    .transform(
      babelify.configure({
        ignore: [/(bower_components)|(node_modules)/]
      })
    )
    .transform(envify(process.env))
    .bundle()
    .on('error', handleError)
    .pipe(source('app.js'))
    .pipe(buffer())
    .pipe(gulpif(globalSettings.production, stripDebug()))
    .pipe(gulpif(globalSettings.production, uglify()))
    .pipe(gulp.dest(taskSettings.scripts.dest));
  

Я попытался заменить пользовательский envify на обычный (примеры отсутствуют в их readme):

 const envify = require('envify');

// function declarations etc
  browserify()
    .transform(
      babelify.configure({
        ignore: [/(bower_components)|(node_modules)/]
      })
    )
    .transform(envify)
    .bundle()
    // same as before here
    .pipe(gulp.dest(taskSettings.scripts.dest));
  

Я попытался установить переменную явно:

 const envify = require('envify/custom');

// function declarations etc
  browserify()
    .transform(
      babelify.configure({
        ignore: [/(bower_components)|(node_modules)/]
      })
    )
    .transform(envify({FEATURE_EXAMPLE: 'please, something'})
    .bundle()
    // same as before here
    .pipe(gulp.dest(taskSettings.scripts.dest));
  

Я пробовал очищать:

 const envify = require('envify/custom');

// function declarations etc
  browserify()
    .transform(
      babelify.configure({
        ignore: [/(bower_components)|(node_modules)/]
      })
    )
    .transform(envify({_: 'purge', FEATURE_EXAMPLE: 'please, something'})
    .bundle()
    // same as before here
    .pipe(gulp.dest(taskSettings.scripts.dest));
  

Я попытался запустить его глобально:

 const envify = require('envify/custom');

// function declarations etc
  browserify()
    .transform(
      babelify.configure({
        ignore: [/(bower_components)|(node_modules)/]
      })
    )
    .transform({global: true}, envify({FEATURE_EXAMPLE: 'please, something'})
    .bundle()
    // same as before here
    .pipe(gulp.dest(taskSettings.scripts.dest));
  

Я унаследовал код, поэтому я в основном просто шарю в темноте. Любая помощь будет оценена!

Из того, что я понимаю из envify, я ожидаю следующего вывода:

 "use strict";Object.defineProperty(exports, "__esModule", { value: true });exports.featureToggles = void 0;const featureToggles = {
  FEATURE_EXAMPLE: 'true' === 'true' };exports.featureToggles = featureToggles;
  

Если есть какая-либо помощь, мои функции-переключатели работают локально, но не в моей промежуточной среде. Сначала это также не сработало, когда я перебирал свои функции и читал process.env динамически. Что означало бы, что envify хотя бы что-то делает?