본문 바로가기
SMALL

vue.js3

[Vite]왜 파일 하나만 고쳐도 전체를 빌드할까? Vue+vite를 사용하고 있다.배포할 때 마다 파일 하나만 수정했을 뿐인데, 전체를 다시 빌드하여 혹시나 수정하지 않은 파일에 잘못 저장하여 쓰잘데기 없는 글자 하나라도 들어가 있을까봐 병적으로 전체소스 diff 내역 있는지 없는지 확인하는 습관이 있다.왜 번들링 방식을 사용하는 건지 , vite의 작동 구조를 알아보자#개발 시빠른 개발 피드백이 목적이다브라우저가 ES 모듈 방식으로 필요한 파일만 요청한다예를 들어 App.vue 파일이 변경되면, 그 파일만 다시 처리해서 반영된다전체를 묶지 않고, 번들링도 하지 않는다페이지 새로고침, HMR 속도가 매우 빠르다-> 개발은 “빠른 반응”이 중요하므로 전체 빌드가 필요 없다.#배포 시내부적으로 Rollup 사용전체 소스를 분석해 최소한의 JS/CSS로 묶음.. 2025. 6. 22.
[VUE.JS] vue.js에서 데이터 변화를 감지하는 watch() 담당업무 중 프론트가 vue.js로 되어있는데  데이터 변화할 때 마다 특정 부분을 변경해줘야 했는데watch()로 해결하였다. vue.js를 벗어날 수 없으니 공부를 열심히 해봐야겠다 . . ....  Vue.js의 watch()는 무엇인가 ?-> 데이터가 바뀔 때 특정 코드를 실행할 수 있게 해주는 기능이며, 데이터 변화를 감지하고 그에 맞춰 동작을 수행할 수 있다.watch() 안에 변수를 넣고 화살표 함수를 사용하면 특정 데이터 속성을 감시할 수 있다 주의사항! !this의 바인딩: 화살표 함수에서는 this가 바뀌지 않으므로, Vue 인스턴스의 데이터나 메소드를 사용하려면 this를 적절하게 사용해야 한다. javascript의 관찰자 패턴 또는 이벤트 리스너와 비슷한 거 같다.(데이터나 상태의.. 2024. 9. 21.
코드 난독화란 ? 난독화 시 오류 발생 가능성은 ? 담당하고 있는 시스템에서 front는 vue.js + typescript로 구성되어 있다. 얘는 또 코딩 후 빌드하여 난독화 된 소스로 운영 이행을 하고 있다.개발 환경에서 정상 100번 확인하고 운영에 넘겼다가 문제가 발견되어 급히 롤백을 했는데 ㅎㅎ심장강화이벤트 원인 분석 중 코드는 암만 봐도 문제 없고, 빌드 과정을 의심 우선순위에 두고 있다. 과거엔  블록 주석이 아닌 한 줄 주석을 사용했을 경우 난독화하여 빌드하는 과정에서 오류가 발생하는 경우가 있었다고도 들었다. 사실 보안때문에 난독화를 해야한다니 걍 하고 있구나. 만 알고 있었지 난독화에 대해 자세히 알지 못하여 정리해보았다.  난독화를 사용하는 이유는 ?소프트웨어 보안 및 저작권 보호와 관련하여 사용 ! 악성 코드 작성자들은 난독화를 사용.. 2024. 5. 5.
LIST