У меня проблемы с модулем Browserify Envify в универсальном приложении React.
У меня есть следующий файл переключения функций:
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));
Я пытался заменить custom 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
динамически. Что означало бы, что зависть хоть что-то делает?