typescript (2) 썸네일형 리스트형 Vite + React + tailwind CSS Vite + React + Typescript 설정npm create vite@latest tailwind CSS 설치npm install tailwindcss postcss, autoprefixer 설치npm install -D postcss autoprefixer postcss.config.js 및 tailwind.config.js 생성npx tailwindcss init -p tailwind.config.js 작성/** @type {import('tailwindcss').Config} */export default { content: ["./src/**/*.{js,jsx,ts,tsx}"], theme: { extend: {}, }, plugins: [],} index.css 작성@.. Webpack(웹팩) 설정하는 법 Webpack(웹팩) 이란?현대 Javascript Application의 Static Module Bundler 필요한 다수의 자바스크립트 파일을 하나의 자바스크립트 파일로 만들어 주는 것을 말한다.Bundle(번들) 이란?소프트웨어 및 일부 하드웨어와 함께 작동하는 데 필요한 모든 것을 포함하는 패키지Webpack을 사용하는 이유연관되어 있는 자바스크립트 파일들을 하나의 파일로 묶어줘서 관리하기 편하다. 컴파일할 때, 여러 모듈들의 파일을 읽어오는데 걸리는 시간을 해결하기 위해 여러 파일을 하나의 파일로 번들링 해준다. 하나의 자바스크립트 파일로 만들어서 웹페이지 성능을 최적화 해준다. 다른 Module Bundler도 많이 존재하지만, performance가 우수하다.Babel(바벨) 이란?.. 이전 1 다음
