env 환경변수 설정하는 방법이 궁금합니다.

Question

안녕하세요.
해당 강의 수강하면서 프로젝트 진행 중에 궁금한 점이 있어 질문드립니다.
실무 환경에서 axios를 이용해 API 호출을 한다고 가정하였을 때, [local, stage, prod] 와 같은 다양한 환경에 대하여 API 호출 도메인이 달라지게 됩니다.
vite를 사용하였을 때에는 .env.local, .env.stage, .env.prod와 같이 환경에 따른 변수를 지정하고, vite --mode local 과 같은 형태로 실행하는 환경을 설정할 수 있었는데요.
이러한 다양한 환경에 다른 값을 지정해야할 떄에 어떻게 사용하시는지 궁금합니다.

짐코딩 · Answer

안녕하세요 :) 환경변수 설정 방법 공유드립니다. dotenv 패키지를 설치합니다. npm install --save-dev dotenv 원하는 환경설정 파일을 프로젝트 루트 디렉토리에 위치 시킵니다. .env.local .env.stage .env.prod quasar.config.js 파일에서 env 옵션 설정 const env = require('dotenv').config({ path: `.env.${process.env.ENV_FILE.toLowerCase()}`, }).parsed; //... module.exports = configure(function (/* ctx */) { return { // ... 중략 ... env: { ...env, }, // ... 중략 ... 빌드 및 개발서버 실행 ENV_FILE=stage quasar build # 빌드 ENV_FILE=stage quasar dev # 개발서버 실행 환경 변수 사용시 process.env.환경변수 감사합니다 🙂