question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Vercel development env crashes startup

See original GitHub issue

Environment

System: OS: macOS 12.3.1 CPU: (10) arm64 Apple M1 Max Memory: 2.65 GB / 32.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 14.19.1 - ~/.asdf/installs/nodejs/14.19.1/bin/node npm: 8.6.0 - ~/.asdf/plugins/nodejs/shims/npm Browsers: Firefox: 98.0.2 Safari: 15.4 npmPackages: next: ^12.1.4 => 12.1.4 next-auth: ^4.3.1 => 4.3.1 react: ^17.0.2 => 17.0.2

Reproduction URL

https://github.com/reconbot/next-auth-example

Describe the issue

When you run vercel pull you get empty vercel env vars which crashes next on startup

# .env Created by Vercel CLI
VERCEL="1"
VERCEL_ENV="development"
VERCEL_URL=""
VERCEL_GIT_PROVIDER=""
VERCEL_GIT_REPO_SLUG=""
VERCEL_GIT_REPO_OWNER=""
VERCEL_GIT_REPO_ID=""
VERCEL_GIT_COMMIT_REF=""
VERCEL_GIT_COMMIT_SHA=""
VERCEL_GIT_COMMIT_MESSAGE=""
VERCEL_GIT_COMMIT_AUTHOR_LOGIN=""
VERCEL_GIT_COMMIT_AUTHOR_NAME=""

By process of elimitation the only problem line is

VERCEL_URL=""

which causes errors because ?? doesn’t behave as if the env var is missing.

The error is

TypeError [ERR_INVALID_URL]: Invalid URL
    at new NodeError (node:internal/errors:371:5)
    at onParseError (node:internal/url:552:9)
    at new URL (node:internal/url:628:5)
    at parseUrl (/Users/wizard/src/next-auth-example/node_modules/next-auth/lib/parse-url.js:18:16)
    at Object.<anonymous> (/Users/wizard/src/next-auth-example/node_modules/next-auth/react/index.js:70:34)
    at Module._compile (node:internal/modules/cjs/loader:1103:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1155:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19) {

The error seems to be coming from parseUrl which might be from this call or this call. We use ?? a lot of places but if an env var is set but an empty string that doesn’t do the desired behavior.

How to reproduce

Run in order

git clone https://github.com/reconbot/next-auth-example # cone the repo
cd next-auth-example
vercel # go ahead and create a project and deploy it
# double check that `System Environment Variables` is enabled
vercel pull
npm i
npm run dev

Expected behavior

It doesn’t crash

Issue Analytics

  • State:open
  • Created a year ago
  • Comments:7 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
reconbotcommented, Apr 14, 2022

As a user I have no control over vercel adding these empty string to my local env. This empty string vs undefined issue is old as time for every language and environment. Best to be friendly here imho.

0reactions
reconbotcommented, May 16, 2022

I’m not sure I agree there’s an offending line, one that’s produced by the build and hosting tooling and not the user. (If they remove it, it will come back)

But handle the condition 💯

Read more comments on GitHub >

github_iconTop Results From Across the Web

Why does my Serverless Function work locally but not when ...
One of the common reasons for different behavior across environments is whether or not your Serverless Functions depend on packages with native dependencies....
Read more >
Why does a certain page of my website crash on mobile ...
I found the issue is related to this file https://pgu2022.vercel.app/_next/static/css/71c9678f5295262f.css.
Read more >
Deploy your Next.js application on Vercel using Sentry and ...
To solve this issue, we could manually add the environment variables as we did for the Github Actions. But there is an easier...
Read more >
Deploy NextJS With Vercel With Custom Domain - YouTube
This is the final video of my NextJS Crash Course series. We deploy our app to Vercel and connect a custom domain name...
Read more >
Using Environment Variables in Python for App Configuration ...
As a developer, you've likely used environment variables in the ... If your app should crash when an environment variable is not set, ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found