Как использовать .env в реакции JS - PullRequest
0 голосов
/ 25 мая 2018

Как использовать .env в реакции.Я могу получить доступ к .env.development и .env.production с помощью

 "start":"react-scripts start",
 "build": "react-scripts build",

Как получить доступ к другому, например .env.staging?

Я дал так

"build_staging": "set REACT_APP_ENV=staging & react-scripts build",

но не работает.

Любые предложения, пожалуйста.

Ответы [ 2 ]

0 голосов
/ 28 февраля 2019

[КОНТЕКСТ] - Я создал проект React с Create React.- Запуск в Windows 10 - Использование VSCode IDE - У меня есть файл .env.development в папке выше /src.- Мой код имеет console.log(process.NODE_ENV) и console.log(process.REACT_APP_YOUR_KEY)


[ПРОБЛЕМА] Когда я запускаю программу с npm start, браузер выводит «development» для NODE_ENV, но для моей переменной React .env она печатает undefined.

Я пытаюсь запустить npm start с изменением сценария по умолчанию package.json на этот start сценарий: set REACT_APP_YOUR_KEY && react-scripts start.Тогда нет никакого undefined, все работает хорошо.10


[РЕШЕНИЕ] Причина в том, что файл .env.development не обнаружен правильно.Моя гипотеза заключается в том, что файл для разработки среды не подходит для Windows или VSCode.

Файлы проводника Windows

VS Проводник кода.Посмотрите на значок файлов ?

Вы должны изменить имя файла с .env.development на .env.

0 голосов
/ 25 мая 2018

Для обеспечения согласованности между linux (мой рабочий сервер) и windows (мой сервер разработки) я использую cross-env

npm install --save cross-env

и мои сценарии выглядят следующим образом

"scripts": {
    "dev": "cross-env NODE_ENV=development node server",
    "build": "cross-env NODE_ENV=production next build ",
    "start": "cross-env NODE_ENV=production node server"
  },

, поэтому для установки пользовательского env, например REACT_APP_ENV, вам потребуется

"build_staging": "cross-env REACT_APP_ENV=staging react-scripts build",

, и вы можете получить к нему доступ в своем коде JavaScript, используя

process.env.REACT_APP_ENV

также для запуска промежуточного сервера вы можете добавить

"start_staging": "cross-envREACT_APP_ENV = постановка сценария реакции запуска "

Подробнее об этом здесь

...