«ReferenceError: процесс не определен» в отладчике WebStorm - PullRequest
Новая
       24

«ReferenceError: процесс не определен» в отладчике WebStorm

0 голосов
/ 14 апреля 2020

У меня очень простая функция в моем реагирующем компоненте, которую я пытаюсь отладить: 

function login(username, password) {
    const requestOptions = {
        method: 'GET',
        headers: {'Authorization': "Basic " + btoa(username + ":" + password)}
    };
    console.log("REACT_APP_API_ROOT: " + process.env.REACT_APP_API_ROOT)
    return fetch(process.env.REACT_APP_API_ROOT + '/user/current', requestOptions)
        .then(handleResponse)
        .then(usr => {
            if (usr) {
                let user = {};
                user.username = usr.principal.username;
                user.authdata = window.btoa(username + ':' + password);
                localStorage.setItem('user', JSON.stringify(user));
                return user;
            } else {
                return null;
            }
        });
}

Я бы хотел видеть текущее значение свойства process.env.REACT_APP_API_ROOT в отладчике ( WebStorm, v. 2020.1), но я получаю следующую ошибку:

enter image description here

Полный текст ошибки: 

ReferenceError: process is not defined
    at eval (eval at login (http://localhost:3000/static/js/main.chunk.js:2382:3), <anonymous>:1:1)
    at Object.login (http://localhost:3000/static/js/main.chunk.js:2382:3)
    at Login.handleSubmit (http://localhost:3000/static/js/main.chunk.js:2175:71)
    at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/0.chunk.js:78334:18)
    at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/0.chunk.js:78383:20)
    at invokeGuardedCallback (http://localhost:3000/static/js/0.chunk.js:78437:35)
    at invokeGuardedCallbackAndCatchFirstError (http://localhost:3000/static/js/0.chunk.js:78452:29)
    at executeDispatch (http://localhost:3000/static/js/0.chunk.js:78585:7)
    at executeDispatchesInOrder (http://localhost:3000/static/js/0.chunk.js:78610:9)
    at executeDispatchesAndRelease (http://localhost:3000/static/js/0.chunk.js:78715:9)
    at executeDispatchesAndReleaseTopLevel (http://localhost:3000/static/js/0.chunk.js:78724:14)
    at forEachAccumulated (http://localhost:3000/static/js/0.chunk.js:78696:12)
    at runEventsInBatch (http://localhost:3000/static/js/0.chunk.js:78741:7)
    at runExtractedPluginEventsInBatch (http://localhost:3000/static/js/0.chunk.js:78887:7)
    at handleTopLevel (http://localhost:3000/static/js/0.chunk.js:84142:9)
    at batchedEventUpdates (http://localhost:3000/static/js/0.chunk.js:80393:16)
    at dispatchEventForPluginEventSystem (http://localhost:3000/static/js/0.chunk.js:84242:9)
    at dispatchEvent (http://localhost:3000/static/js/0.chunk.js:84272:9)
    at unstable_runWithPriority (http://localhost:3000/static/js/0.chunk.js:121600:16)
    at runWithPriority$2 (http://localhost:3000/static/js/0.chunk.js:89805:14)
    at discreteUpdates$1 (http://localhost:3000/static/js/0.chunk.js:100906:16)
    at discreteUpdates (http://localhost:3000/static/js/0.chunk.js:80411:16)
    at dispatchDiscreteEvent (http://localhost:3000/static/js/0.chunk.js:84225:7)

Тем не менее, значение было напечатано в журнале консоли: 

REACT_APP_API_ROOT: http://localhost:8080

Как просмотреть значение свойства process.env.REACT_APP_API_ROOT в отладчике?

1 Ответ

2 голосов
/ 14 апреля 2020

process определяется только в консольных приложениях, запускаемых с Node.js, а приложения React запускаются в браузере, поэтому process недоступен во время выполнения. Он работает для вас, когда вы запускаете приложение, потому что код предварительно обрабатывается Webpack DefinePlugin , который заменяет все вхождения process.env на строковые значения.

См. create- response-app .env: процесс не определен для получения дополнительной информации

...