[React/Mobx] Mobx 시작하기

일단 리액트 이용하여 프로젝트 생성!! 

이때, 리액트 프로젝트의 경우, mobx에서 사용하는 decorator문법(@를 사용한 문법의 형태)을 지원하지 않아 설치해야 함. (초기 설치 시, npm 사용하였기에 npm으로 설치)

npx create-react-app 프로젝트이름
cd 프로젝트 이름
npm run eject

 

# 아래 에러 발생 시, 

Remove untracked files, stash or commit any changes, and try again.....

git add .
git commit -m "commit before eject"

commit 해준 다음 npm run eject 실행할 것 !! 

그래도 안된다면, 아예 새로운 디렉터리를 만들어서 그 곳에서 실행해볼 것 ! 

 

---

Mobx 설치

1. mobx와 mobx-react 설치

npm install mobx mobx-react --save

2. babel 플러그인 설치 

npm add @babel/plugin-proposal-class-properties @babel/plugin-proposal-decorators

3. babel 설치 후 package.json 들어가서 설정 바꿔주기

: babel 부분에 가서 아래 내용으로 수정!! 

"babel": {
    "presets": [
      "react-app"
    ],
    "plugins": [
        ["@babel/plugin-proposal-decorators", { "legacy": true}],
        ["@babel/plugin-proposal-class-properties", { "loose": true}]
    ]
  }