use vite's import.meta.env instead of process.env

Author: fennifith

src/constants/site-config.ts

@@ -1,6 +1,6 @@
-const buildMode = process.env.BUILD_ENV || "production";
+const buildMode = import.meta.env.BUILD_ENV || "production";
 const siteUrl = (() => {
-	let siteUrl = process.env.SITE_URL || process.env.VERCEL_URL || "";
+	let siteUrl = import.meta.env.SITE_URL || import.meta.env.VERCEL_URL || "";
 
 	if (siteUrl && !siteUrl.startsWith("http")) siteUrl = `https://${siteUrl}`;
 

src/utils/get-picture.ts

@@ -43,8 +43,10 @@ function getSupportedWidth(width: number) {
 
 const isDev = Boolean(import.meta.env?.DEV);
 
-const cloudName = process.env.PUBLIC_CLOUDINARY_CLOUD_NAME;
-if (!isDev && !cloudName)
+const PUBLIC_CLOUDINARY_CLOUD_NAME = import.meta.env
+	.PUBLIC_CLOUDINARY_CLOUD_NAME;
+
+if (!isDev && !PUBLIC_CLOUDINARY_CLOUD_NAME)
 	console.error("missing public variable CLOUDINARY_CLOUD_NAME");
 
 function getSource(src: string, width: number, getFormat: string) {
@@ -58,7 +60,7 @@ function getSource(src: string, width: number, getFormat: string) {
 	} else {
 		// If in production use cloudinary's fetch
 		const domainUrl = new URL(src, siteUrl);
-		return `https://res.cloudinary.com/${cloudName}/image/fetch/w_${width},f_${getFormat},q_auto/${encodeURIComponent(domainUrl.toString())}`;
+		return `https://res.cloudinary.com/${PUBLIC_CLOUDINARY_CLOUD_NAME}/image/fetch/w_${width},f_${getFormat},q_auto/${encodeURIComponent(domainUrl.toString())}`;
 	}
 }