vite에서 절대 경로 설정하기

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'), // 추가적인 경..

  • format_list_bulleted ETC ✏️/Etc
  • · 2024. 6. 24.
  • textsms
vercel 배포 시, 새로고침 또는 특정 URL에서 404 Not Found 에러 해결 방법

vercel 배포 시, 새로고침 또는 특정 URL에서 404 Not Found 에러 해결 방법

vercel에서 배포 후, 특정 링크로 이동하거나 새로고침을 할 때 404 Not Found가 뜨는 경우가 있다. vercel은 기본적으로 index.html 파일을 루트 디렉토리에서 찾는다.이때, vercel이 번들링 프로세스를 시작지점을 찾는데 어려움을 겪을 때 발생한다. 루트 디렉토리에 vercel.json 파일을 만들고, 아래 코드를 작성한다.이미 깃허브에서 배포한 경우, 파일을 만들고 푸시하면 적용된다!  1. routes 설정첫번째 방법은 먼저 filesystem의 경로를 확인하고,실제로 존재하는 파일들을 우선적으로 제공하고, 이외에 다른 모든 경로는 index.html로 리디렉션 하는 것이다.{ "routes": [{ "handle": "filesystem" }, { "src": "/...

  • format_list_bulleted ETC ✏️/Etc
  • · 2024. 6. 14.
  • textsms
vscode에서 전역에서 한번에 이름 바꾸기 / 파일 내 같은 이름 교체하기

vscode에서 전역에서 한번에 이름 바꾸기 / 파일 내 같은 이름 교체하기

전역에서 여러 단어 바꾸기1) fn + f2 2)🌌 Window : ctrl + H  🍎 Mac : cmd + shift + H  한 페이지에서 여러 단어 바꾸기1. cmd + D2. option + cmd + f mac vscode shortcuthttps://code.visualstudio.com/shortcuts/keyboard-shortcuts-macos.pdf

  • format_list_bulleted ETC ✏️/Etc
  • · 2024. 5. 22.
  • textsms
tailwindcss가 vite에서 적용 안될 때 해결 방법(tailwindcss not working in vite)

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..

  • format_list_bulleted ETC ✏️/Etc
  • · 2024. 5. 12.
  • textsms
커밋 메시지 템플릿 설정하고, 짱편하게 커밋하기

커밋 메시지 템플릿 설정하고, 짱편하게 커밋하기

커밋 컨벤션(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새로운 ..

  • format_list_bulleted ETC ✏️/Etc
  • · 2024. 5. 1.
  • textsms