Programming/React4 cra 로 생성한 프로젝트에 빌드시 콘솔로그 코드 모두 제거하기 (eject 사용안함) * cra 로 생성한 프로젝트에 babel 재정의 하여 빌드시 콘솔로그 코드 모두 제거 (eject 사용안함) 1. 관련 컴포넌트 설치npm i -D customize-cra react-app-rewired babel-plugin-transform-remove-console 2. package.json 파일 내 react-scripts 를 react-app-rewired 로 변경 "scripts": { "start": "react-app-rewired start", "build": "react-app-rewired build", "test": "react-app-rewired test", "eject": "react-scripts eject"} 3. 프로젝트 루트에 config-overrides.js .. 2025. 2. 26. react build (빌드) 시 .js.map 파일 생성 안되도록 처리 react build (빌드) 시 .js.map 파일 생성 안되도록 처리 npm run build 를 통해 빌드시 build 디렉토리에 static/js/*.js.map 파일들이 생성되는데, 이는 크롬 개발자 도구를 통해 소스 확인 시 내가 구성한 각 컴포넌트 구성 및 소스들이 그대로 보이게 된다. 운영 서버에 소스 배포시 위와 같다면 소스가 그대로 노출되기 때문에 좋지 않아 보인다. 아래와 같이 .env 파일을 프로젝트 최상위에 생성하고, 그 내부에 아래와 같은 내용을 넣고 저장한다. - 파일명 : .env GENERATE_SOURCEMAP = false 이후 npm run build 시 *.js.map 파일들이 생성되지 않는다. 그리고, 위 map 파일이 없어 크롬 개발자 도구로 확인 시 소스구조가 .. 2020. 1. 28. 모바일 웹 SPA 페이지 기본 구성 1. myapp 이라는 이름으로 기본 앱 생성 create-react-app myapp 2. 디렉토리 기본 구성 : src 폴더 아래 components 와 res 를 만들고 res 아래 css 를 만든다. (각 컴포넌트들은 components 에, css는 /res/css 에 위치시킬 예정) 3. 페이지 수정 1) src/index.js 수정 import React from 'react'; import ReactDOM from 'react-dom'; import './res/css/style.css'; import App from './App'; import * as serviceWorker from './serviceWorker'; ReactDOM.render(, document.getElementB.. 2019. 12. 23. React spa 개발환경 설정 (윈도우환경) React spa 개발환경 설정 (윈도우환경) 1. node 설치 - https://nodejs.org/ 에 접속하여 최신 버전 다운로드 / 설치 2. create-react-app 설치 - 윈도우 터미널로 이동하여 아래 명령어로 설치 - npm install -g create-react-app 3. 내 앱 폴더 생성 및 앱 생성 - 윈도우 터미널로 이동(윈도우키+R 누르고 cmd 입력)하여 아래 명령어로 설치 1) d드라이브에 node_app 폴더를 만들고 이 안에 앱들을 생성하려한다. mkdir node_app cd node_app 2) sample 앱 설치 (이름은 자유롭게) create-react-app sample (typescript기반으로 생성하려면 "npx create-react-app s.. 2019. 12. 19. 이전 1 다음
