애 둘 냥 둘

Vue 3 출시 후 꽤 많은 시간이 흘러 stable 해졌다고 판단하여 일부 프로젝트에서 Vue 3 를 사용하기 위한 사전 준비를 하고 있다. 아니다, stable 은 개뿔. 개판이다. Vue 3 에서도 Vue 2 부터 쓰던 문법을 계속 쓸 수 있으므로 전환에는 크게 문제가 없는데 이왕 쓸 거라면 Vue 3 에서 권장하는 방식으로 해야 하지 않겠는가. 2022.06.22 - [개발/Front-End] - Vue CLI 를 통한 Vue 프로젝트 생성 Vue CLI 를 통한 Vue 프로젝트 생성 상당히 오랫동안 Webpack 을 통해 만들어진 프로젝트를 깎고 깎아 사용하다가 신규 프로젝트를 생성할 일이 생겨 Vue CLI 를 통해 만들어보기로 한다. 일단 Vue CLI 를 실치해야 한다. NPM 과 Yarn..

webpack 에서 브라우저 캐싱을 회피하기 위한 전략으로 hash 값을 많이 사용한다. 일반적으로 [name].[contenthash][ext] 같이 파일명에 hash 값을 많이 사용하는데, 파일명에 hash 값이 들어있을 경우 파일 내용이 변경되거나 빌드 때 chunk id 가 변경되어 파일명이 계속 바뀌는 문제가 있다. 이 경우 이미 업로드 된 파일을 지우고 다시 올려야 하는 번거로움이 생긴다. 나의 경우 파일명 난독화가 필요하기도 하여 hash 값을 이용하긴 해야 한다. 따라서 파일명으로 난독화 처리를 하였다. const path = require("path"); const crypto = require("crypto"); const IS_LIVE = process.env.NODE_ENV === ..

상당히 오랫동안 Webpack 을 통해 만들어진 프로젝트를 깎고 깎아 사용하다가 신규 프로젝트를 생성할 일이 생겨 Vue CLI 를 통해 만들어보기로 한다. 일단 Vue CLI 를 실치해야 한다. NPM 과 Yarn 을 프로젝트마다 혼용해서 사용하고 있지만 여기는 Yarn 을 사용. > yarn -g add @vue/cli 설치가 잘 끝났는지 확인하기 위해 버전 확인을 한다. > vue --version 'vue' 은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. yarn 에 전역으로 설치할 일이 없다 보니 환경 변수가 안 들아가 있나 보다. > yarn global bin C:\Users\...\AppData\Local\Yarn\bin 저 경로를 윈도우 환경 변수에..

어느 날 문득 그런 생각이 들었습니다. 블로그 작성 시간을 굳이 표시할 필요가 있을까? 그냥 날짜만 출력하면 되지 않을까? 분명히 똑같은 생각을 한 사람이 있겠죠. 구글링을 해봅니다. 많이 나오네요. 위에서부터 하나씩 봅니다. 일단 스킨에서 날짜 치환자는 이걸 사용하네요. 근데 이렇게 바꾸래요. 얼핏 몇 개 찾아본 글들이 다 이렇습니다. 저 코드는 javascript 로 글자를 잘라내서 다시 화면에 출력하는 코드죠. 이상합니다. 분명히 티스토리에서 기본적으로 제공하는 코드가 있을 거예요. 그리고 스킨 제작을 위해 매뉴얼이 있을 테고요. 개발자라면 매뉴얼 찾기가 기본 소양이죠. https://tistory.github.io/document-tistory-skin/ 소개 · GitBook 티스토리 스킨 가이..

사람이 살다 보면 갑자기 뭔가에 막 빠져들어 자다가도 생각나고 먹다가도 생각나는 그런 게 있죠. 그것은 바로! 봄 사랑 벚꽃 말고 전자 공학! 잡설은 그만두고. IoT 에 입문하게 되면 가장 많이 활용하게 되는 시스템이 바로 스마트싱스라고 할 수 있죠. 사실 구글 홈도 많이 쓰게 되는데 이건 IoT 구축이라기보다는 리모컨이 가까운 개념이라. 그리고 IoT 하면 제일 먼저 생각나는 그 이름. 스마트 플러그. 스마트 플러그는 원격으로 전원을 컨트롤 할 수 있게 해 줍니다. 더불어 대부분은 전력 소비량을 측정할 수 있죠. 그럼 이제 집 티비가 삼성 티비가 아니더라도 스마트싱스에서 확인할 수 있게 됩니다. 이런 식으로 말이죠. 근데 자동화 처리를 할 때 이거 굉장히 귀찮은 일입니다. 뭐 하려고 할 때마다 소비전..

작년인가 재작년인가 세팅한 프로젝트와 동일한 구성으로 새로운 프로젝트를 만들 일이 생겼다. 밑바닥부터 새로 만들기에는 열정과 연봉이 부족하여 기존 프로젝트를 복사했다. 그리고 npm i 실행. npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: pug-loader@2.4.0 npm ERR! Found: pug@3.0.2 npm ERR! node_modules/pug npm ERR! dev pug@"^3.0.2" from the root project npm ERR! peer pug@"^2.0.0 || ^3.0.0" from pug-plain-loader@1.1.0 npm ERR! node_..

도비는 여전히 jQuery 마이그레이션 작업 중. 2022.05.17 - [개발/javascript] - jQuery 마이그레이션 - Deprecated, Removed jQuery 마이그레이션 - Deprecated, Removed jQuery 1.12.1 쓰던 사이트에서 보안 이슈로 3.6.0으로 마이그레이션 작업 중. 사이트의 구조와 환경이 괴랄하여 한 땀 한 땀 장인 정신으로 수정해야 하는 상황이다. https://api.jquery.com/category/deprecated. naveen.tistory.com .selector 가 removed 되었다고 있어서 이게 뭔 소린가 하고 찬찬히 살펴보았다. 미친 듯이 구글링을 했다는 소리다. HTML 삽입 미리보기할 수 없는 소스 $.fn.newPlu..

내부망에서 NPM 패키지 설치를 위해 방화벽을 해제할 필요가 생겼다. 우선 package-lock.json 파일을 열고 어디서 패키지를 가져오는지 확인. registry.npmjs.org 해제. 포트는 443. 그리고 git+ssh://git@gitbhub.com 이건 쉽다. ssh.github.com 해제. 포트는 역시 443. package-lock.json 파일을 더 봐도 뭐가 더 없다. 그럼 다시 시도. 네? raw.githubusercontent.com? 이걸 저장소로 쓴다고? 이건 파일 raw 보기용 아닙니까? 너어는 진짜 나쁜 놈이네. https://github.com/imagemin/imagemin-gifsicle/issues/33 Error: Command failed: C:\WINDOW..

jQuery 1.12.1 쓰던 사이트에서 보안 이슈로 3.6.0으로 마이그레이션 작업 중. 사이트의 구조와 환경이 괴랄하여 한 땀 한 땀 장인 정신으로 수정해야 하는 상황이다. https://api.jquery.com/category/deprecated/ Deprecated | jQuery API Documentation Add the previous set of elements on the stack to the current set. Attach a handler to an event for the elements. The DOM node context originally passed to jQuery(); if none was passed then context will likely be the d..