webpack) process.env 환경변수 설정

 

1. package.json에서 local, dev환경 분리하여 켤 수 있게 셋팅하기

 

...
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "local": "vue-cli-service serve --mode local",
    "dev": "vue-cli-service serve --mode dev"
  },
  ...

 

 

2. .env.local 과 .env.development 파일 생성하여 셋팅하기

 

루트 디렉토리에 만들어야됨

 

process.env.NODE_ENV 는 기본적으로 제공되는 NODE 환경변수이다.

나머지 변수들은 꼭 앞에

VUE_APP을 붙여줘야 인식한다.

 

 

 

3. js로 환경변수 사용하기

 

 

- npm run local (.env.local 파일 사용)

- npm run serve(.env.development 파일 사용)