리액트개발환경구축2 [React] 직접 개발 환경을 구축하고 배포시 이미지가 안 보일 때 | copy-webpack-plugin CRA(Create React App)를 쓰지 않고 리액트 개발환경을 직접 구축할 수 있다는 것을 알게 된 이후 npx create-react-app my-app 같은 명령어를 커맨드라인에 치는 것보다 하나라도 직접 해보자는 생각으로 과제를 할 때 바벨과 웹팩을 이용하여 리액트 개발환경을 구축하고 있다. 그러면서 CRA가 얼마나 많은 환경설정들을 포함하고 있는지도 알게 되는 중이다. 사전과제를 진행하면서 로컬에 이미지 파일을 저장하고 배포할 때 같이 묶어서 배포하는데 데브서버에서 잘 보이던 이미지가 배포를 하고 나니 원하는대로 보이지 않고 엑박인 상황이 발생했다. file-loader를 설정해줘야 했나 싶어서 설치하고 웹팩에 해당 설정을 해주었는데도, npm build 로 앱이 빌드된 상황을 보니 설정해.. 2022. 1. 19. [React] CRA 쓰지 않고 리액트 개발환경 구축 | webpack.config.js 리액트로 개발을 하는 사람이라면 직접 개발환경을 구축하기보다는 npx create-react-app my-app 이라는 명령어로 개발환경을 구축하는 경우가 많을 것 같다. 나는 리액트를 처음 시작할 때, 개발환경을 직접 구축할 수 있다는 생각을 하지 못했고 위의 명령어를 사용하는 것이 리액트를 사용하는 방법이라고만 알고 있었다. 그런데 리더님이 넘겨주신 자료를 보며, babel과 webpack을 포함하여 직접 리액트의 개발환경을 구축할 수 있다는 사실을 알게 되었다. CRA로 개발환경을 구축하면 편리하다는 장점이 있지만, 사용하지 않는 기능까지 포함하여 모듈의 크기가 크다는 단점을 꼽을 수 있다. 프론트엔드 스터디의 1주차 과제로 리액트 개발환경 구축하기를 하고 이를 계기로 webpack에 대한 궁금증이.. 2022. 1. 4. 이전 1 다음
