공부/Etc (5) 썸네일형 리스트형 vite에서 절대 경로 설정하기 vite.config에서 alias 를 사용해서 찾을 경로와 바꿀 경로를 연결 해주면 된다import { defineConfig } from 'vite';import react from '@vitejs/plugin-react';import path from 'path';export default defineConfig({ plugins: [react()], resolve: { alias: { '@': path.resolve(__dirname, 'src'), 'components': path.resolve(__dirname, 'src/components'), 'assets': path.resolve(__dirname, 'src/assets'), // 추가적인 경.. vercel 배포 시, 새로고침 또는 특정 URL에서 404 Not Found 에러 해결 방법 vercel에서 배포 후, 특정 링크로 이동하거나 새로고침을 할 때 404 Not Found가 뜨는 경우가 있다. vercel은 기본적으로 index.html 파일을 루트 디렉토리에서 찾는다.이때, vercel이 번들링 프로세스를 시작지점을 찾는데 어려움을 겪을 때 발생한다. 루트 디렉토리에 vercel.json 파일을 만들고, 아래 코드를 작성한다.이미 깃허브에서 배포한 경우, 파일을 만들고 푸시하면 적용된다! 1. routes 설정첫번째 방법은 먼저 filesystem의 경로를 확인하고,실제로 존재하는 파일들을 우선적으로 제공하고, 이외에 다른 모든 경로는 index.html로 리디렉션 하는 것이다.{ "routes": [{ "handle": "filesystem" }, { "src": "/... vscode에서 전역으로 이름 바꾸기 / 파일 내 같은 이름 교체하기 전역에서 한번에 바꾸기1. fn + f2 2. search 창에서 변경Window : ctrl + H Mac : cmd + shift + H 한 페이지에서 여러 단어 바꾸기1. cmd + D2. option + cmd + f tailwindcss가 vite에서 적용 안될 때 해결 방법(tailwindcss not working in vite) 프로젝트 설정 중 CRA에서는 tailwindcss가 작동되는데, vite에서는 작동이 되지 않았다. 1. 공식 문서 방법installation에는 없고, 검색어로 vite를 검색해야 나온다.기존 tailwind 설치 이외에 2개의 패키지 설치가 필요하다.npm install -D tailwindcss postcss autoprefixer Install Tailwind CSS with Vite - Tailwind CSSSetting up Tailwind CSS in a Vite project.tailwindcss.com 2. 기존 방법 + vite.config 수정1번 방법을 찾기 전에 다른 방법을 찾아서 적용했다.이미 공식문서대로 설치 후 작동 안되는 것을 발견했을 때, vite.config파일에서 c.. 커밋 메시지 템플릿 설정하고, 짱편하게 커밋하기 커밋 컨벤션(commit convention)프로젝트 참여자들이 일관적인 커밋 메시지를 작성하기 위한 규칙, 가이드라인을 의미한다.1. 가독성 향상으로 작업 내용 파악하기 쉬움 (커뮤니케이션 효율 증대)2. 변경 이력 추적 용이 Conventional CommitsA specification for adding human and machine readable meaning to commit messageswww.conventionalcommits.org 위 사이트에서는 커밋 메세지를 구성하는 방법을 아래와 같이 요약하고 있다: [optional body][optional footer] 1. 변경 사항 유형으로, 해당 내용만 봐도 어떤 커밋의 내용인지 확인하기 위해 명확하게 작성해야한다.feat새로운 .. 이전 1 다음
