не может прочитать переменные окружения в приложении, созданном create-реагировать на приложение - PullRequest
Новая
       8

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

1 голос
/ 14 октября 2019

Я использовал create-реакции-приложение для генерации приложения узла. Я изменил файл app.js так, чтобы он выглядел так: 

import React from 'react';
import logo from './logo.svg';
import './App.css';
let a = process.env.SOMETHING;
console.log(a)
function App() {
    console.log(process.env)
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          { process.env.SOMETHING }
        </a>
          </header>
          <div>The value of something: ${a}</div>
    </div>
  );
}

Я бы ожидал, что переменная a будет отражать то, что я установил в среде. Когда я смотрю на консоль после запуска приложения, она не определена, и все, что я вижу, это знак доллара, где переменная должна быть вставлена.

Я пытался установить переменную двумя способами. Сначала я создал bash-файл с именем setup.bash и дал ему разрешение на выполнение. Это выглядит так:

setup.bash 

export SOMETHING="boom"

Затем я изменил package.json на это: 

{
  "name": "server",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.10.2",
    "react-dom": "^16.10.2",
    "react-scripts": "3.2.0"
  },
  "scripts": {
    "start": "./setup.bash && react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Когда это не сработало, я попыталсязапустите приложение следующим образом: 

SOMETHING=BOOM npm start

... и переменная среды осталась неопределенной.

Кто-нибудь может увидеть, в чем может быть проблема?

1 Ответ

2 голосов
/ 14 октября 2019

Создать .env.development текстовый файл. Затем вы можете перечислить там переменные, но все они должны начинаться с префикса REACT_APP_.

Например: REACT_APP_API_URL=https://api.url

Вы также можете запустить npm start команда с переменными, объявленными перед ней:

REACT_APP_API_URL="https://api.url" npm start, но, опять же, помните о префиксе.

Подробнее о переменной среды для create-реакции-приложения здесь .

...