npm과 함께 쓰는거라
.env.development, .env.production 파일을 사용하여 개발환경과 프로덕션환경에서 다른 환경 변수를 사용하려면, 다음과 같은 절차를 따르면 됩니다.
.env.development, .env.production 파일을 프로젝트 루트 폴더에 생성합니다..env.development 파일에 개발 환경에서 사용할 환경 변수를 설정합니다..env.production 파일에 프로덕션 환경에서 사용할 환경 변수를 설정합니다.npm start 명령어를 실행할 때는 개발 환경에서, npm run build 명령어를 실행할 때는 프로덕션 환경에서 .env 파일 대신 .env.development 또는 .env.production 파일을 사용하도록 설정합니다.이를 구현하기 위해서는 다음과 같이 설정합니다.
.env.development, .env.production 파일을 프로젝트 루트 폴더에 생성합니다.bash# .env.development
REACT_APP_API_URL=http://localhost:8000/api-dev
bash# .env.production
REACT_APP_API_URL=https://example.com/api
.env.development, .env.production 파일에 각각 환경변수를 설정합니다.
package.json 파일에서 scripts 항목을 다음과 같이 수정합니다.
json"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"start:dev": "cp .env.development .env && react-scripts start",
"build:prod": "cp .env.production .env && react-scripts build"
}
위 코드에서 start:dev 명령어는 .env.development 파일을 .env 파일로 복사하고, react-scripts start 명령어를 실행합니다. build:prod 명령어는 .env.production 파일을 .env 파일로 복사하고, react-scripts build 명령어를 실행합니다.
npm run start:dev 명령어를 실행하면 .env.development 파일의 환경 변수를 사용하여 개발환경에서 앱을 실행할 수 있습니다. npm run build:prod 명령어를 실행하면 .env.production 파일의 환경 변수를 사용하여 프로덕션 빌드를 생성할 수 있습니다.자세한 사항은 아래 링크로 https://create-react-app.dev/docs/adding-custom-environment-variables/