본문 바로가기

Front End 개발/기타2

[Tip] 브라우저에서 JS, CSS 파일 변경사항 반영 안 될 때 해결 방법 1. 문제 상황 개발하다가 코드 변경 사항이 브라우저(크롬)에 반영이 안 될 때가 있었다. 분명 파일은 변경됐고 웹팩 빌드도 잘 되어서 build 폴더에 있는 min.js 파일까지 제대로 변경이 됐는데 브라우저에는 새로고침을 해도 변경사항이 반영이 되지 않았다. 찾아보다가 브라우저가 파일을 캐싱하고 있어서라는 사실을 알았다. 2. 해결 방법 개발자 도구 > 네트워크 탭에 들어간다. 그러면 상단에 Disable cache가 있는데 이를 체크하면 된다. 한글 모드에서는 캐시 사용 중지를 체크하면 된다. 2022. 1. 26.
[환경설정] 바닐라 자바스크립트 + Webpack + Babel + Jest 설정하기 바닐라 자바스크립트로 프론트엔드 개발을 시작하기에 앞서 웹팩과 바벨을 사용하여 개발 환경을 설정하려 합니다. 웹팩과 바벨은 다음과 같은 역할 등을 수행할 수 있습니다. Webpack 의존 관계에 있는 자바스크립트, CSS, 이미지 등의 리소스들을 하나(또는 여러 개)의 파일로 번들링하는 모듈 번들러 웹팩을 사용하면 의존 모듈이 하나의 파일로 번들링되므로 별도의 모듈 로더가 필요 없습니다. 또한 여러 개의 자바스크립트 파일을 하나로 번들링함으로써 HTML 파일에서 script 태그로 여러 개의 자바스크립트 파일을 로드해야 하는 번거로움도 사라질 수 있습니다. Babel 최신 사양의 소스 코드를 ES5 사양의 소스 코드로 변환(transpiling) 바벨은 ES6 이상의 자바스크립트 소스 코드를 트랜스파일링.. 2021. 9. 6.
반응형