본문 바로가기

React4

[error] Failed to parse source map from ... Error: ENOENT: no such file or directory [ 상황 ] react 애플리케이션을 start 하거나 build 하면 아래와 같이 Failed to parse source map from ... Error: ENOENT: no such file or directory extractParamsFromWeigthMap.ts 파일이 존재하지 않아 source map 파싱이 실패한다. [ 원인 ] 실제로 사용하고 있는 face-api.js 모듈은 extractParamsFromWeigthMap.ts 파일을 제공하지 않음을 확인할 수 있다. [ 해결-1 ] `source-map-loader` rule의 exclude에 해당 경로를 설정한다. module: { ... rules: [ { exclude: [ /\/node_modules\/face-api.*/, .. 2022. 1. 1.
[error] Module not found: Error: Can't resolve 'fs' in '..../node_modules/~~~~~~~' [ 상황 ] webpack3로 잘 번들링해서 사용하고 있던 react 프로젝트. 새롭게 추가할 npm을 지원하지 않는 문제 + 더 빠른 빌드 속도를 위해서 webpack5로 버전을 올렸다. 업그레이드를 하자 프로젝트를 실행(yarn start)하거나 빌드(yarn build)할 때 다음과 같은 오류가 나타났다. Module not found: Error: Can't resolve 'fs' in '/home/adslk/bitbucket/pams_citest/pesadmin/node_modules/helpme-js/build/es6/env' node_moduels 모듈을 사용하기 위해 reoslve를 진행하는데 'fs'를 사용할 수 없다고 한다. [ 원인 ] fs는 node에서 제공하는 기본 모듈이므로 모듈.. 2022. 1. 1.
[jenkins] React 프로젝트 Docker + jenkins로 CI/CD 📑 젠킨스 튜토리얼 내용 정리 Node + React 로 만든 웹애플리케이션을 Docker + Jenkins로 CI/CD 해보기 위한 샘플 프로젝트. 1. 도커를 설치한다. 2. 도커 Bridge network 를 만든다. docker network create jenkins 3. Jenkins nodes 내부에서 `Docker commands`를 실행하기 위해서 `docker:bind` 도커 이미지를 다운로드하고 실행. 사용하는 터미널에 따라 커맨드 개행 문자가 다름. bash - \, powershell - `, 명령프롬트 - ^ Windows의 경우 실패시 13번 생략해보세요. 더보기 더보기 docker run \ --name jenkins-docker \ --rm \ --detach \ --pri.. 2021. 12. 25.
[react] React 최적화 성능개선 데이터 관리 - 10년 된 태블릿에서도 빠르게 돌려보자. 서비스하고 있는 시스템에서 성능문제로 컴플레인을 받았다. 데이터를 처리하는 기능이 느리다는 문제였고, 사용기기를 확인하니 2014년에 출시한 갤럭시 탭4.7.. 🤣 useMemo, memo, shouldcomponentupdate, componentdidupdate, useCallback 등... 렌더링 관련 최적화는 모두 적용했는데도 느리다면? 렌더링 최적화가 아닌 데이터 사용방식을 최적화하면서 느낀 부분을 정리합니다. 1분 로딩에서 1초 로딩으로 ㄱㄱㄱ # Redux는 최대한 작은 데이터만 관리 # SQLite는 바보다. 실행계획 잘 살피고, 트랜잭션 최소한으로 사용하자. # 꼭 필요한 곳만 새 객체 만들기 // 😋 const list_a = [1, 2, 3, 4, 5]; list_a.push(6);.. 2021. 11. 26.