Deployment Error

Help
,
1

I was trying to do my initial build deployment and got this error:
Current Error:
src/ai.ts(62,9): error TS2322: Type ‘string | undefined’ is not assignable to type ‘string’.
Attempts to Solve this Specific Error:

  1. Type Guarding: Implemented if (!geminiApiKey) { throw … } to ensure runtime definition.
  2. Non-null Assertions (!): Used geminiApiKey! directly in the GoogleGenAI constructor.
  3. Type Assertions (as string): Applied geminiApiKey as string and (geminiApiKey || ‘’) as string.
  4. Explicit Intermediate Variable: Assigned geminiApiKey to const apiKeyString: string = geminiApiKey;.
  5. Default Fallback Value: Used geminiApiKey || ‘’ to guarantee a string.
  6. Aggressive d.ts Modification: Defined VITE_GEMINI_API_KEY as string & {} in src/vite-env.d.ts.
  7. Switched to process.env: Changed from import.meta.env to process.env.VITE_GEMINI_API_KEY.
    • Installed @types/node and updated tsconfig.app.json with “node” types.
    • Configured vite.config.ts to explicitly define process.env.VITE_GEMINI_API_KEY using JSON.stringify.
  8. Debugging console.log: Added console.log(process.env.VITE_GEMINI_API_KEY) to src/ai.ts, but no output appeared in Vercel build logs.
    Despite these comprehensive attempts, the error persists, indicating a potential issue with the Vercel build environment’s TypeScript configuration or environment variable handling.
4

Can you share a snippet from ai.ts that seems to be throwing the error? You should be able to hover over the variable and see its type

I can confirm that narrowing the type like this will turn string | undefined into string in the same block (though that doesn’t work across scopes/functions)

if (!process.env.GEMINI_API_KEY) {
  throw new Error('GEMINI_API_KEY not found')
}

Another possible concern is since you’re prefixing it with VITE, you may be trying to access this on the client? Your AI API keys should never be accessible in the client, and there are automated crawlers that look for exposed credentials like this and will take advantage of them (especially where AI tokens are concerned)

5

Thank you for the reply!

Here is the function in question:

// — CORE AI CALLER —

/**

A generic function to call the Gemini AI provider.
*/
async function callAI(
prompt: string,
aiModelSettings: AIModelSettings
): Promise {
const geminiApiKey = process.env.VITE_GEMINI_API_KEY;

if (!geminiApiKey) {
throw new Error(“VITE_GEMINI_API_KEY is not set in the environment.”);
}

const ai = new GoogleGenAI({ apiKey: geminiApiKey! }); // Use type assertion as process.env might be string | undefined
const modelName = aiModelSettings.gemini || ‘gemini-1.5-flash’;
try {
const response = await ai.models.generateContent({
model: modelName,
contents: prompt,
config: {
responseMimeType: “application/json”,
}
});
return response.text;
} catch (error) {
console.error(“Error calling Gemini API:”, error);
throw new Error(Gemini API call failed: ${error instanceof Error ? error.message : String(error)});
}
}

As for the other subject, this project was originally something I made for myself and it had no backend. My goal now is to refactor the app. Rest assured, the API Keys will be safely on the server side. :slight_smile:

6

I’m at my wits end and tried everything I can think of including hardcoding the model name as a string literal and it’s still giving me the same error. To see if it was a problem with Vercels build environment, I tried to deploy the code at Netlify and it gives the same error.