Я хочу настроить глобальные переменные среды, определяющие текущую среду, в которой работает приложение Webpacked ReactJS (разработка, производство, тестирование или развертывание). Однако я получаю эту очень странную ошибку при попытке получить доступ к моей переменной среды __ENV__
.
Следующие аналогичные фрагменты кода не работают с той же ошибкой, Uncaught ReferenceError: deployment is not defined
, где развертывание является значением __ENV__
, а не ref name. То же самое происходит независимо от того, какую ценность я ему даю. Вот три примера:
console.log(process.env.NODE_ENV);
global.__ENV__ = process.env.NODE_ENV || 'development';
console.log(__ENV__); // crashes here otherwise crashes at next line
global.__PROD__ = __ENV__ == 'production';
global.__DEPLOY__ = __ENV__ == 'deployment';
global.__DEV__ = __ENV__ == 'development';
global.__TEST__ = __ENV__ == 'test';
console.log(process.env.NODE_ENV);
window.__ENV__ = process.env.NODE_ENV || 'development';
console.log(__ENV__); // crashes here otherwise crashes at next line
window.__PROD__ = __ENV__ == 'production';
window.__DEPLOY__ = __ENV__ == 'deployment';
window.__DEV__ = __ENV__ == 'development';
window.__TEST__ = __ENV__ == 'test';
console.log(process.env.NODE_ENV);
window.__ENV__ = process.env.NODE_ENV || 'development';
console.log('${__ENV__}'); // crashes here otherwise crashes at next line
window.__PROD__ = '${__ENV__}' == 'production';
window.__DEPLOY__ = '${__ENV__}' == 'deployment';
window.__DEV__ = '${__ENV__}' == 'development';
window.__TEST__ = '${__ENV__}' == 'test';
Даже более странный, этот подход работает вместо этого:
const __ENV__ = process.env.NODE_ENV || 'development';
console.log(__ENV__);
global.__PROD__ = __ENV__ === 'production';
global.__DEPLOY__ = __ENV__ === 'deployment';
global.__DEV__ = __ENV__ === 'development';
global.__TEST__ = __ENV__ === 'test';
Моя конфигурация Webpack включает в себя следующее:
config.globals = {
'process.env': {
'NODE_ENV': JSON.stringify(config.env)
},
'__ENV__': config.env,
'__DEPLOY__': config.env === '"deployment"',
'__DEV__': config.env === '"development"',
'__PROD__': config.env === '"production"',
'__TEST__': config.env === '"test"'
};
webpack_config.plugins.push(
new webpack.DefinePlugin(config.globals)
);
Любая идея, почему это вещь?
Если это может оказать какую-либо помощь, моя кодовая база передается из ES2015 с включенными предложениями этапа 0, а затем отправляется как один пакет с использованием Webpack.
Единственная причина, по которой это произойдет, - это настроить ваш инструмент сборки, заменив глобальные ссылки на __ENV__
чем-то другим.
Поэтому инструмент сборки заменит
console.log(__ENV__);
с
console.log(development);
Это не работает в строгом режиме, поскольку переменная- development
не определена.
Вы не показываете, как вы настроили свой инструмент сборки, но вместо того, чтобы делать что-то вроде
replace('__ENV__', 'development')
так должно быть
replace('__ENV__' , '"development"')
так что инструмент построения вставляет строковый литерал в код (вместо имени переменной).
(если значение исходит от переменной, сначала передайте ее через JSON.stringify
, что добавит кавычки)
__ENV__
до того, как в первой строке третьего образца будет напечатано неопределенное значение. Любая идея?