잉어빵

이전에 vue-cli 에서 관리 되던 프로젝트를 vite 로 생성된 프로젝트로 변경 하는 작업을 계속 하던 와중 require is not defined라는 오류가 발생 됨 

기존 프로젝트에서는 잘되던 코드였는데 vite 환경에서만 안되길래 vite 레퍼런스를 확인 해본 결과 vite에서는 require 가 아닌 import.meta.glob을 사용해야 한다고 작성 되어 있음

//기존 코드
const modules = require.context('./dir', true, /\.js$/);

//수정된 코드
const modules = import.meta.glob('./dir/*.js');

단, modules 의 형태는 다르게 나오기 때문에 하단 코드들도 환경에 맞게 다시 작성해야 하는 사항이 생겼음

참고 : https://vitejs.dev/guide/features.html#glob-import

기존 vue cli로 만들어 낸 프로젝트를 vite 프로젝트로 변경 하게 되면서 기존 사용 하던 function 형태의 외부 라이브러리를 불러 올 수 없다는 에러가 발생함

import 파일명 from '폴더1/폴더2/파일이름';

불러오고 있는 코드는 위와 같이 확장자명(.js) 없이 import 하였는데 이 부분에서 문제일까 확인해봤지만 해결되지 않았음

그래서  콘솔을 확인 해보니 js 파일 내부에 export 하는 구문 없이 (function(){})(); 형태의 즉시 실행 함수 였음

[Error] Uncaught SyntaxError: The requested module '*.js' does not provide an export named 'default'

어찌 되었든 에러 이유는 export 되는 내용이 필요하였기 때문에 아래처럼 수정함

const 내보낼 함수명  = (function(){})();

export default 내보낼 함수명

객체에 담아서 사용하다 보면 key 값만 뽑아서 사용 하고 싶은 경우나 value 값들만 뽑아서 사용해야 하는 경우가 생기는데 매번 배열을 돌려서 하나하나 뽑기보단 Object.values() 라는 메서드를 이용하면 된다.

const obj = {
	a: 2,
    b: 42,
    c: 4
};

Object.values(obj) // [2, 42, 4]

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/values

특정 날짜가 속해 있는 월의 마지막 날짜 구하기 

let date = new Date();

date.setDate(1); // 날짜를 1일로 수정
date.setMonth(date.getMonth()+1); // 다음 달로 날짜 수정 후
date.setDate(0); // 날짜를 0일로 수정 하면 0일이 없기 때문에 이전 달의 마지막 날짜로 수정

특정 날짜가 속해 있는 주의 요일별 날짜 구하기

const date = new Date();
let dayIndex = 0;

const getDayDate = (date ,dayIndex) => {	
    let paramDate = date;
    
    while(paramDate.getDay() != dayIndex) {
    	if(paramDate.getDay() < dayIndex) {
        	paramDate.setDate(paramDate.getDate()+1);
        }else{
        	paramDate.setDate(paramDate.getDate()-1);
        }
    }
    
    return paramDate;
}

this.getDayDate(date, dayIndex) // 해당 일자의 주차별 값