Vue.js에서 환경별(dev, alp, prd)옵션을 통해 분기처리하기(NODE_ENV 사용)

개요

vue js(intellij환경)에서 npm run dev를 통해 항상 테스트를 했다. local환경과 production은 환경이 다르기에, 환경별 분기문이 필요할 때가 있다. 이때는 아래와 같이 수행하면 된다.

package.json 파일 수정

script의 dev앞부분에 NODE_ENV로 시작하는 key에 value(development)를 넣는 구문을 추가한다.

{
  "name": "MyApplication",
  ...
  "scripts": {
    "dev": "NODE_ENV=development webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
    "build": "node build/build.js"
  },
  ...
}

사용 방법

사용방법은 간단하다. process.env.NODE_ENV 변수를 가져와서 value(이번 경우는 development)에 따라 분기문을 넣으면 된다.

function servers() {
  if(process.env.NODE_ENV === 'development')
    return ['localhost:8081']
  else
    return [
      'ec2-production01',
      'ec2-production02']
}

상기와 같은 분기문을 통해 local에서는 localhost:8081을 return하고, 그 외 환경에서는 ec2-production01, ec2-production02 host명을 return하도록 작동한다.

 

끝