React,Node,JQuery,js
[React] 환경변수 / 공통변수 사용하는 방법
bryan.oh
2020. 2. 17. 17:37
반응형
방법1
src 폴더 아래 js 파일을 하나 생성합니다.
config.js
export const ELASTIC_URL = '10.20.30.40:9200';
export const ES_INDEX_NAME = 'img_text_data';
export const ES_DOC_TYPE = '_doc'
사용 방법
import * as config from './config';
// ..
function someMethod(){
let host = config.ELASTIC_URL; // 이렇게 사용
}
이 방법이 좀 간단합니다.
아래의 방법2는 개발환경/배포환경에 따라 다른 변수가 필요할 때 유용합니다.
방법2
create-react-app 으로 프로젝트를 생성했다고 가정하고
프로젝트 root 에 파일을 만듭니다.
.env.development
.env.production
.env.development 파일의 내용은
REACT_APP_DB_HOST=192.168.1.244:9200
.env.production 파일의 내용은
REACT_APP_DB_HOST=10.12.1.52:9200
여기에서 중요한것.
각 파일에 변수를 정할 때 앞에는 REACT_APP_ 를 붙혀야 합니다.
npm start 로 하면 .env.development 파일의 내용을 사용하고
npm run build 로 하면 .env.production 파일의 내용을 사용합니다.
사용은 process.env. 을 붙히고 사용합니다.
<p>{process.env.REACT_APP_DB_HOST}</p>
.env.--- 파일의 내용을 수정하면 npm 으로 다시 시작해야합니다.
추가로
.env.test 파일도 있고 이 파일은
npm test 로 실행했을 경우 사용합니다.
728x90
반응형