sveltekit에서도 env 파일을 기본적으로 지원합니다.

env 파일은 민감 정보를 노출하지 않기 위해 별도로 빼놓고 git과 같은 저장소에 업로드하지 않게 

하여 민감정보가 노출되지 않게하는 역할을 하는 파일입니다

.gitignore 파일에보면

.env

.env.* 

이렇게 .env로 설정한 파일은 git에 올리지 말라고 설정되어 있습니다.

git에 commit 해도 해당 파일은 올라가지 않게 됩니다.

sveltekit 을 최초로 설치하면 두개의 env 파일이 생성?되는데,

.env.development

.env.production

이렇게 두게 파일을 생성됩니다.

여기에 키와 값을 입력하면

svelte 프로젝트 파일에서(js, svelte) 상수같이 사용할 수 있습니다.

.env.* 파일에

VITE_API_ENDPOINT = "http://그누보드설치/api"

이렇게 선언을하고("" 로 선언해야하며 '' 로 하면 ''도 포함되어서 반영됩니다.)

svelte나 js 파일에서

import.meta.env.VITE_API_ENDPOINT

라고 쓰면 해당 값을 불러오게 됩니다.

그리고

파일 안에 보면

VITE_DEBUG_MODE 

가 나오는데

.env.development 에는

VITE_DEBUG_MODE = true

.env.production 에는

VITE_DEBUG_MODE = false

로 되어 있는데

npm run dev 와 npm run build 할때 차이가 납니다.

주로

npm run dev하면 내컴에서 개발용으로 하니까

api 서버도 로컬환경으로 돌리는 경우 로컬 api 에 맞추어서 설정해 놓고

배포시에는

.env.production

에 서버용 설정을 해 놓으라는 편의 기능인것 같습니다.

그리고

개발 할때는

svelte 파일에서

console.log() 를 자주 사용하는데

이걸 일일이 쓰고 나중에 배포할때 지워야할 수 있는데

svelte 빌드시 기존 파일을 사용하지 않기 때문에

새로 생성되는 파일에는 

dev설정을 하면 해당 내용은 생성을 하지 않게 됩니다.

그래서

import { dev } from '$app/environment';

해놓고

if (dev) console.log("로고 보여주기")

또는 줄여서

dev & console.log("로고 보여주기")

이렇게 해 놓으시면

빌드해서 배포할때 이부분은 반영에서 삭제해줍니다.

저는 통신하는 쪽에 dev 걸어 놓고 요청 값과 리턴받은 값은 기본 log 로 보이게 설정해 놓고

빌드하면 자동으로 지워주니 마음 놓고 log값을 보면서 개발하고 있습니다.