[Solved] Vercel Postgres + Nuxt Starter template gives 'missing_connection_string' when running local – Vercel

The Problem:

When running the Vercel Postgres + Nuxt Starter template locally, the user encounters an error message of ‘missing_connection_string’ despite providing the necessary environment variables in a .env.local file. Attempts to modify the code by adding a connection string to the createPool() function result in a ‘invalid_connection_string’ error, indicating the use of a direct connection string instead of a pooled one.

The Solutions:

\n

Solution 1: Update the code to access environment variables as Vite requires

\n

As Vite requires environment variables to be prefixed with VITE_, update the code to the following:

const db = createPool({
  connectionString: process.env.VITE_POSTGRES_URL + "?sslmode=require",
});

This will allow Vite to access the environment variable correctly.

Solution 2: Remove .local extension from .env file

Vercel Postgres requires the environment variables to be set in a .env file, not .env.local. Rename the .env.local file to .env and try running the application again. This should resolve the ‘missing_connection_string’ error.

Solution 3: Using .env.development.local

Instead of using ".env.local", try creating a file named ".env.development.local" in the root directory. Save your environment variables in this file, and it will be picked up by the application when running locally. This method should resolve the "missing_connection_string" issue.

Solution 4: Try using `vercel dev`

If running npm run serve doesn’t resolve the issue, consider using vercel dev instead. This command starts a local development server that more closely resembles the Vercel production environment. It may provide a more accurate representation of your application’s behavior.

Additionally, ensure that you have a .env.development.local file in place. This file should contain the necessary environment variables for your local development environment.

Video Explanation: