Netlify Dev not seeing my environment variables all of a sudden

Hi

Re: Site name = stupefied-lamarr-20c8d9

Up until about a week ago, I was happily using Netlify Dev to develop the above NodeJs/React app, but then all of a sudden, the environment variables stopped showing up in my process.env

Below I have pasted the console log, from my local, Netlify Dev build, showing my entire process.env. I have several environment variables set in the UI - for example MONGO_URI_DEV and MAIN_URI - but none of them are in Node’s process.env any longer.

Something must have changed just recently…right?

[BTW I now see there are different deploy contexts I could be using, so my existing environment variables need to be reorganized to use those, but even so, I’m not getting any of them]

Thanks for your help!
Simon

{
ALLUSERSPROFILE: ‘C:\ProgramData’,
APPDATA: ‘C:\Users\simon\AppData\Roaming’,
AWS_DEFAULT_REGION: ‘us-east-1’,
AWS_EXECUTION_ENV: ‘AWS_Lambda_nodejs16.13.2’,
AWS_LAMBDA_FUNCTION_MEMORY_SIZE: ‘625’,
AWS_LAMBDA_FUNCTION_NAME: ‘handler’,
AWS_LAMBDA_FUNCTION_VERSION: ‘1.0’,
AWS_REGION: ‘us-east-1’,
BRANCH: ‘development’,
BUILD_ID: ‘0’,
CACHED_COMMIT_REF: ‘0e5611ff7b6e66d66fca0e294c6a9e8e1fc2775a’,
CHROME_CRASHPAD_PIPE_NAME: ‘\\.\pipe\LOCAL\crashpad_22628_GHLLMWSZZUAVDLSZ’,
COLOR: ‘1’,
COLORTERM: ‘truecolor’,
COMMIT_REF: ‘8fcb33fea09d404478f97385da48428b119b01a0’,
CommonProgramFiles: ‘C:\Program Files\Common Files’,
‘CommonProgramFiles(x86)’: ‘C:\Program Files (x86)\Common Files’,
CommonProgramW6432: ‘C:\Program Files\Common Files’,
COMPUTERNAME: ‘LAPTOP-CQ4QLLFQ’,
ComSpec: ‘C:\WINDOWS\system32\cmd.exe’,
CONTEXT: ‘dev’,
DEPLOY_ID: ‘0’,
DEPLOY_PRIME_URL: ‘https://development--stupefied-lamarr-20c8d9.netlify.app’,
DEPLOY_URL: ‘http://localhost:8888’,
DEPRECATED: ‘Please use the new environment variable endpoints outlined here: Get started with the Netlify API | Netlify Docs’,
DriverData: ‘C:\Windows\System32\Drivers\DriverData’,
EDITOR: ‘notepad.exe’,
EFC_9780: ‘1’,
FPS_BROWSER_APP_PROFILE_STRING: ‘Internet Explorer’,
FPS_BROWSER_USER_PROFILE_STRING: ‘Default’,
GATSBY_TELEMETRY_DISABLED: ‘1’,
GIT_ASKPASS: ‘c:\Users\simon\AppData\Local\Programs\Microsoft VS Code\resources\app\extensions\git\dist\askpass.sh’,
HEAD: ‘development’,
HOME: ‘C:\Users\simon’,
HOMEDRIVE: ‘C:’,
HOMEPATH: ‘\Users\simon’,
INIT_CWD: ‘C:\Simon\code\deepsheet’,
JAVA_HOME: ‘C:\Program Files\AdoptOpenJDK\jdk-8.0.212.04-hotspot’,
LAMBDA_CONSOLE_SOCKET: ‘14’,
LAMBDA_CONTROL_SOCKET: ‘11’,
LAMBDA_RUNTIME_DIR: ‘C:\Simon\code\deepsheet’,
LAMBDA_TASK_ROOT: ‘C:\Simon\code\deepsheet\serverLambda\lambdaFunctions’,
LANG: ‘en_US.UTF-8’,
LANGUAGE: ‘en_US:en’,
LC_ALL: ‘en_US.UTF-8’,
LOCALAPPDATA: ‘C:\Users\simon\AppData\Local’,
LOGONSERVER: ‘\\LAPTOP-CQ4QLLFQ’,
NETLIFY_DEV: ‘true’,
NETLIFY_LOCAL: ‘true’,
NEXT_TELEMETRY_DISABLED: ‘1’,
NODE: ‘C:\Program Files\nodejs\node.exe’,
NODE_ENV: ‘development’,
NODE_PATH: ‘C:\Simon\code\deepsheet\node_modules’,
npm_command: ‘run-script’,
npm_config_cache: ‘C:\Users\simon\AppData\Local\npm-cache’,
npm_config_globalconfig: ‘C:\Users\simon\AppData\Roaming\npm\etc\npmrc’,
npm_config_global_prefix: ‘C:\Users\simon\AppData\Roaming\npm’,
npm_config_init_module: ‘C:\Users\simon\.npm-init.js’,
npm_config_local_prefix: ‘C:\Simon\code\deepsheet’,
npm_config_metrics_registry: ‘https://registry.npmjs.org/’,
npm_config_node_gyp: ‘C:\Users\simon\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js’,
npm_config_noproxy: ‘’,
npm_config_prefix: ‘C:\Users\simon\AppData\Roaming\npm’,
npm_config_userconfig: ‘C:\Users\simon\.npmrc’,
npm_config_user_agent: ‘npm/8.3.1 node/v16.13.2 win32 x64 workspaces/false’,
npm_execpath: ‘C:\Users\simon\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js’,
npm_lifecycle_event: ‘dev’,
npm_lifecycle_script: ‘npm run build && netlify dev’,
npm_node_execpath: ‘C:\Program Files\nodejs\node.exe’,
npm_package_json: ‘C:\Simon\code\deepsheet\package.json’,
npm_package_name: ‘parent’,
npm_package_version: ‘1.0.0’,
NUMBER_OF_PROCESSORS: ‘8’,
NVM_HOME: ‘C:\Users\simon\AppData\Roaming\nvm’,
NVM_SYMLINK: ‘C:\Program Files\nodejs’,
OneDrive: ‘C:\Users\simon\OneDrive’,
ORIGINAL_XDG_CURRENT_DESKTOP: ‘undefined’,
OS: ‘Windows_NT’,
Path: ‘C:\Simon\code\deepsheet\node_modules\.bin;C:\Simon\code\node_modules\.bin;C:\Simon\node_modules\.bin;C:\node_modules\.bin;C:\Users\simon\AppData\Roaming\npm\node_modules\npm\node_modules\@npmcli\run-script\lib\node-gyp-bin;C:\Program Files\AdoptOpenJDK\jdk-8.0.212.04-hotspot\bin;C:\Program Files (x86)\Intel\iCLS Client\;C:\Program Files\Intel\iCLS Client\;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\WINDOWS\System32\OpenSSH\;C:\Program Files\Git\cmd;C:\Program Files\Docker\Docker\resources\bin;C:\ProgramData\DockerDesktop\version-bin;C:\Users\simon\AppData\Roaming\npm;C:\Program Files\nodejs;C:\Users\simon\AppData\Roaming\nvm;C:\Program Files\nodejs;C:\Program Files (x86)\Elm\0.19.1\bin;C:\Users\simon\AppData\Local\Microsoft\WindowsApps;C:\Users\simon\AppData\Local\atom\bin;C:\Users\simon\AppData\Local\GitHubDesktop\bin;C:\Users\simon\AppData\Local\Microsoft\WindowsApps;C:\Users\simon\AppData\Local\Programs\Microsoft VS Code\bin;C:\Program Files\skaffold\;C:\Program Files (x86)\mongodb-cli-4.4.3\bin;C:\Program Files (x86)\GitHub CLI\;C:\Users\simon\AppData\Roaming\nvm;C:\Program Files\nodejs;’,
PATHEXT: ‘.COM;.EXE;.BAT;.CMD;.VBS;.VBE;.JS;.JSE;.WSF;.WSH;.MSC;.CPL’,
PROCESSOR_ARCHITECTURE: ‘AMD64’,
PROCESSOR_IDENTIFIER: ‘Intel64 Family 6 Model 142 Stepping 10, GenuineIntel’,
PROCESSOR_LEVEL: ‘6’,
PROCESSOR_REVISION: ‘8e0a’,
ProgramData: ‘C:\ProgramData’,
ProgramFiles: ‘C:\Program Files’,
‘ProgramFiles(x86)’: ‘C:\Program Files (x86)’,
ProgramW6432: ‘C:\Program Files’,
PROMPT: ‘$P$G’,
PSModulePath: ‘C:\Users\simon\Documents\WindowsPowerShell\Modules;C:\Program Files\WindowsPowerShell\Modules;C:\WINDOWS\system32\WindowsPowerShell\v1.0\Modules’,
PUBLIC: ‘C:\Users\Public’,
PULL_REQUEST: ‘false’,
REPOSITORY_URL: ‘GitHub - simonrumi/deepsheet’,
SESSIONNAME: ‘Console’,
SITE_ID: ‘ed91e416-971c-419c-9c42-b091b8351ee1’,
SITE_NAME: ‘stupefied-lamarr-20c8d9’,
SystemDrive: ‘C:’,
SystemRoot: ‘C:\WINDOWS’,
TEMP: ‘C:\Users\simon\AppData\Local\Temp’,
TERM_PROGRAM: ‘vscode’,
TERM_PROGRAM_VERSION: ‘1.78.2’,
TMP: ‘C:\Users\simon\AppData\Local\Temp’,
TZ: ‘America/Los_Angeles’,
URL: ‘http://localhost:8888’,
USERDOMAIN: ‘LAPTOP-CQ4QLLFQ’,
USERDOMAIN_ROAMINGPROFILE: ‘LAPTOP-CQ4QLLFQ’,
USERNAME: ‘simon’,
USERPROFILE: ‘C:\Users\simon’,
VSCODE_GIT_ASKPASS_EXTRA_ARGS: ‘–ms-enable-electron-run-as-node’,
VSCODE_GIT_ASKPASS_MAIN: ‘c:\Users\simon\AppData\Local\Programs\Microsoft VS Code\resources\app\extensions\git\dist\askpass-main.js’,
VSCODE_GIT_ASKPASS_NODE: ‘C:\Users\simon\AppData\Local\Programs\Microsoft VS Code\Code.exe’,
VSCODE_GIT_IPC_HANDLE: ‘\\.\pipe\vscode-git-1ede5a78f4-sock’,
VSCODE_INJECTION: ‘1’,
windir: ‘C:\WINDOWS’,
WWISEROOT: ‘C:\Program Files (x86)\Audiokinetic\Wwise 2021.1.10.7883’,
WWISESDK: ‘C:\Program Files (x86)\Audiokinetic\Wwise 2021.1.10.7883\SDK’,
_HANDLER: ‘auth.handler’
}

1 Like

What version of Netlify CLI are you using? Try updating it.

Thanks for the response, @hrishikesh

That did not solve the issue for me, however it has led me down a path of making a bunch of updates…still sorting through those and hoping I’ll find a fix

cheers!
Simon

Hey @simonrumi1! After running netlify dev, do you see many lines of e.g. ◈ Injected site settings env var: <ENV_VAR_NAME>? If not, can you double-check that you’re logged in to the CLI with a user that is on the team that owns the site? Thank you!

I just want to add that I am experiencing this same issue.

I’m on the latest release of netlify cli, I am logged in, and I’m the site owner. I do not see ◈ Injected site settings env var: <ENV_VAR_NAME> when starting the dev server.

Hi @jasonb - thanks for the reply…below is a snippet of what I see when running netlify dev - the 2nd line “Injected build settings env var: DEPRECATED” and 3rd line “Ignored general context env var: LANG (defined in process)” sound suspicious…any clue as to what they mean?

◈ Netlify Dev ◈
◈ Injected build settings env var: DEPRECATED
◈ Ignored general context env var: LANG (defined in process)
◈ Loaded function auth http://localhost:8888/.netlify/functions/auth.
◈ Loaded function authReturn http://localhost:8888/.netlify/functions/authReturn.
◈ Loaded function authReturnGoogle http://localhost:8888/.netlify/functions/authReturnGoogle.
◈ Loaded function dbConnector http://localhost:8888/.netlify/functions/dbConnector.
◈ Loaded function graphql http://localhost:8888/.netlify/functions/graphql.
◈ Loaded function resolvers http://localhost:8888/.netlify/functions/resolvers.

@artanderson, just confirming that you’ve run netlify link inside the repo as well?

@simonrumi1, the string “Injected build settings env var” is indicative of an older CLI version – can you confirm that you’re on the latest version of the CLI (as of writing, 15.7.0) with netlify --version ? Edit: If using a version less than 11.5.0, you may get the DEPRECATED message like you pasted above.

@jasonb this is a site that I’ve been developing for quite some time now, and had linked when I started building. I just ran netlify link again and relinked and things seem to be good now. Do you know what might have broken the existing link?

@artanderson usually that means that the /.netlify/state.json file was deleted, or the siteId value inside that file changed to something else. That sounds unlikely though… not sure what would have made that occur.

@jasonb Interesting… good to know it was an easy fix. Thanks, appreciate the help!

1 Like

Hi @jasonb I tried updating netlify-cli …the previous version was at 14.x , but that did not help

I am currently trying to upgrade to Apollo 4 (I was using apollo-server-lambda to help serving netlify’s lambda functions, but just found out that is now way out of date)

…my current issue is that my create-react-app now won’t start because it says “Something is already running on port 3000”

I added these 2 lines to the [dev] section of my netlify.toml, as I found them in another netlify support discussion
functionsPort = 3001
targetPort = 3000

but they haven’t helped and I’m not super clear on what they’re doing. If you have anything for me to read on the whole port thing, including how the lambda functions fit into the picture, that’d be appreciated

@simonrumi1 can you try to change targetPort to something besides 3000, like 8080 or 8888? Also, if you’re on macOS, you can kill a process running on a port by running sudo lsof -i :3000 (where 3000 is the port number), and then killing the process identifier (PID) that displays in the result with kill -9 <PID>

Thanks @jasonb
When I switched the targetPort to 8080 I get the same issue:

◈ Netlify Dev could not connect to localhost:8080.
◈ Please make sure your framework server is running on port 8080

The thing I’m confused about is how all the different ports are interacting. I have
Create React App runs on 3000
Netlify toml has target port 8080
Netlify toml has functionsPort 3001
In the console it reports that my various lambda functions are on port 8888

FYI I’m on windows, so I use the equivalent powershell stop-process command

If your React server is running on Port 3000, targetPort should be set to 3000 as well. Regarding something else running on that port, maybe something was indeed running? Did you try resrtarting, or maybe changing the port React runs on?

thanks, @hrishikesh

I tried setting the targetPort to 3000 and I made sure there were no node processes running before starting up my app, but I still got the error “Something is already running on port 3000” just before the app shut down the Netlify Dev server and exited

I also tried changing both the targetPort and the CRA port to 3001, but got the error message “Something is already running on port 3001”

So it seems likely that the issue is something that’s happening during startup

For reference I’m pasting the complete log of the attempted build process below. My setup works like this:

I have a parent folder with a “master” package.json which contains these scripts:

"scripts": {
      "test": "echo \"Error: no test specified\" && exit 1",
      "start": "cd client && npm run start",
      "tailwind:css": "tailwind build -i client/src/css/tailwind.src.css -c client/tailwind.config.js -o client/src/css/tailwind.css",
      "postinstall": "cd serverLambda && npm install && cd ../client && npm install",
      "prebuild": "npm run tailwind:css",
      "build": "cd client && npm run build",
      "dev": "npm run build && netlify dev"
   },

to run the app in dev, I type

npm run dev

which changes to a /client folder (where the React code is) and builds that

The package.json in /client has these scripts:

"scripts": {
      "start": "react-scripts start",
      "build": "react-scripts build",
      "test": "react-scripts test",
      "test:coverage": "react-scripts test --coverage",
      "test:debug": "react-scripts --inspect-brk test --runInBand --no-cache",
      "eject": "react-scripts eject"
   },

Having build the React code, the parent package.json then runs netlify dev

netlify dev then runs the parent “start” script (automagically), which in turn runs the “start” script in the /client folder, which starts React

…but that’s when it gets the error saying that something is already running on the React port

The above setup was working with an older version of netlify-cli …so is there something in the new version that means I need to change the above setup?

— here’s the log (I had to put spaces after each “http” to prevent them all showing up as links which is not allowed by your system) —

PS C:\Simon\code\deepsheet> npm run dev

parent@1.0.0 dev
npm run build && netlify dev

parent@1.0.0 prebuild
npm run tailwind:css

parent@1.0.0 tailwind:css
tailwind build -i client/src/css/tailwind.src.css -c client/tailwind.config.js -o client/src/css/tailwind.css

Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db
Why you should do it regularly: GitHub - browserslist/browserslist: 🦔 Share target browsers between different front-end tools, like Autoprefixer, Stylelint and babel-preset-env

Done in 636ms.

parent@1.0.0 build
cd client && npm run build

client@0.1.0 build
react-scripts build

Creating an optimized production build…
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db
Why you should do it regularly: GitHub - browserslist/browserslist: 🦔 Share target browsers between different front-end tools, like Autoprefixer, Stylelint and babel-preset-env
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db
Why you should do it regularly: GitHub - browserslist/browserslist: 🦔 Share target browsers between different front-end tools, like Autoprefixer, Stylelint and babel-preset-env
Compiled with warnings.

src\middleware\initializeSheet.js
Line 3:10: ‘fetchSheet’ is defined but never used no-unused-vars
Line 3:22: ‘fetchSheetByUserId’ is defined but never used no-unused-vars
Line 8:10: ‘clearedFocus’ is defined but never used no-unused-vars

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

File sizes after gzip:

176.26 kB build\static\js\main.3d653119.js
3.2 kB build\static\css\main.7d6ca84a.css

The project was built assuming it is hosted at /.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.
You may serve it with a static server:

npm install -g serve
serve -s build

Find out more about deployment here:

https ://cra.link/deployment

wasm streaming compile failed: TypeError: fetch failed
falling back to ArrayBuffer instantiation
◈ Netlify Dev ◈
◈ Injected build settings env var: DEPRECATED
◈ Ignored general context env var: LANG (defined in process)
◈ Loaded function auth http ://localhost:8888/.netlify/functions/auth.
◈ Loaded function authReturn http ://localhost:8888/.netlify/functions/authReturn.
◈ Loaded function authReturnGoogle http ://localhost:8888/.netlify/functions/authReturnGoogle.
◈ Loaded function dbConnector http ://localhost:8888/.netlify/functions/dbConnector.
◈ Loaded function graphql http ://localhost:8888/.netlify/functions/graphql.
◈ Loaded function resolvers http ://localhost:8888/.netlify/functions/resolvers.
◈ Loaded function helpers http ://localhost:8888/.netlify/functions/helpers.
◈ Loaded function typeDefs http ://localhost:8888/.netlify/functions/typeDefs.
◈ Functions server is listening on 3000
◈ Starting Netlify Dev with Create React App
Request from ::ffff:127.0.0.1: GET /spreadsheet.ico
Response with status 404 in 2 ms.
Request from ::ffff:127.0.0.1: GET /spreadsheet.ico
Response with status 404 in 1 ms.

parent@1.0.0 start
cd client && npm run start

Request from ::ffff:127.0.0.1: GET /spreadsheet.ico
Response with status 404 in 0 ms.

client@0.1.0 start
react-scripts start

Something is already running on port 3000.
◈ “npm run start” exited with code 0. Shutting down Netlify Dev server

interesting, this is the culprit here. I’m assuming you’re not forcing this port, right?

Hi @hrishikesh

ohhh I see…actually I was setting the functionsPort in the netlify.toml file 3000, so I changed it to 3001 and that fixed the problem - now it will at least run without exiting

so thanks!

Since I am still not able to load the environment variables, I think I need to sort that out next (that was the original question I posted above)

BTW I see someone else recently had a similar issue

I’ll post updates here as I make progress so I don’t forget what I did (in case anyone else needs to know this)

My setup had involved using npm commands to do some building and then call netlify dev. when I did that I was not getting the environment variables show up in the console logging that netlify dev does…and my app was not getting those environment variables either

So I tried just directly running netlify dev on the command line - that worked. Now I can see the environment variables populating, and netlify dev also shows a temporary animation in the console, while it is waiting for the targetPort to become available. In my case I have create react app running on port 3000, so netlify dev is waiting for that to be ready. Clearly trying to run netlify dev using an npm command doesn’t work with the new version of netlify-cli

Also, I’m on Windows and any time I stop my application using ctrl-C in the console, I also have to run stop-process -Name "node" in order to stop the remaining node process. Otherwise, next time I try to run my app I get an error saying that something is already running on port 3000. (this never used to happen previously)

My next problem is that all my lambda functions, which netlify dev reports as running on localhost:8888, all return status 500 (ie they crash)

Apollo (a graphql library) has a sandbox I’m using, and it suggested running the following

npx diagnose-endpoint@1.1.0 --endpoint=http://localhost:8888/.netlify/functions/graphql

that resulted in the following information

:warning: OPTIONS response is missing header ‘access-control-allow-methods: POST’
:warning: POST response missing ‘access-control-allow-origin’ header.
If using cookie-based authentication, the following headers are required from your endpoint:
access-control-allow-origin: https://studio.apollographql.com
access-control-allow-credentials: true
Otherwise, a wildcard value would work:
access-control-allow-origin: *

I’m not clear how/where I should add those headers into the netlify dev system, so looking into that next

1 Like

Hi @hrishikesh

As I mentioned above, I am getting 500 errors whenever I go to any of the urls for my lambda functions.

In the console it reports that the lambda functions are running, for example:

◈ Loaded function auth http://localhost:8888/.netlify/functions/auth.

but if I paste that url in a browser I get a 500 error

Additionally, I have console logging both before the handler function and inside the handler function but neither of them are getting printed…so it seems the code for my lambda functions aren’t being reached, even though some part of the lambda-function system knows where to find them

Is there some documentation on how the lambda function endpoints are created? I’m looking for somewhere I could put a console log that would get printed

thanks!

There’s nothing fancy with Lambda functions: Create functions | Netlify Docs.

Based on what you’ve mentioned above, your setup is definitely not normal and we can’t guess anything about it over text. Only a minimal reproduction can help us see the issue and help you fix it.