react 소스보기 숨기기

설명전) react 소스보기 숨기기는 개발자도구>Sources>Page에서 현재 본인이 작성한 코드가 노출된 것을 가린다는 의미입니다.  노출이 되었을 때 개발이 어떻게 되었고 어떤 api를 이용해서 진행되었는지 다 확인이 되기 때문에 보안상으로 숨겨야합니다. 

 

저는 window 환경에서 작업을 기준으로 설명한 것이니 혹시 맥북으로 진행하셨으면 현재 내용은 참고하는 정도로만 진행해주시길 바랍니다. 

 

1. package.json에서 scripts 안에 있는 build내용을 GENERATE_SOURCEMP=false를 추가합니다. 

  "scripts": {
    "start": "react-scripts start",
    "build": "set \"GENERATE_SOURCEMAP=false\" && react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

2. build를 진행합니다. 

추가 설명) 그전에 build한 것이 있다면 제거하고 다시 build를 진행해주시길 바랍니다. 

npm run build

3. build한 것을 로컬에서 테스트 진행할려면 serve를 설치합니다.

npm i -g serve

4. serve에서 build를 실행합니다. 

serve -s build

추가 설명) Local 경로로 접속하시면 build된 상태를 확인하실 수 있습니다. 

5. 소스보기 숨기기가 되었는지 확인합니다.