TW Elements React

TW 요소는 반응합니다

TW ELEMENTS REACT는 Tailwind CSS를위한 무료, 대화식 반응 구성 요소의 막대한 컬렉션입니다.

500+ UI 구성 요소 다크 모드 지원 쉬운 테마 및 사용자 정의 단순하고 1 분 설치 개인 및 상업용 용도로 무료 TW ELEMENTS를 시작하여 지금 반응하십시오!

---

목차

• 목차
• 특허
• 곧 올 것입니다
• 구성 요소
• 설치

---

특허

TWE React Alpha 라이센스 정보는 라이센스 파일에서 제공됩니다.

---

곧 올 것입니다

다가오는 기능을 확인하십시오 - 우리의 소셜 프로파일을 시청하여 조기 액세스하십시오 !

드래그 앤 드롭 빌더	템플릿	디자인 블록

---

구성 요소

가장 작은 세부 사항에주의를 기울여 만든 멋진 구성 요소 모음. 양식, 카드, 버튼 및 수백 명의 다른 사람들이 반응하여 모든 프로젝트에 필요한 모든 필수 요소를 찾을 수 있습니다.

DatePicker (곧 출시)	드롭 다운 (곧 출시)	모달
차트 (곧 출시)	툴팁 (곧 출시)	회전 목마 (곧 출시)
아코디언	탭	스테퍼 (곧 출시)
Timepicker (곧 출시)	보행인	Navbar (곧 출시)
알림 (곧 출시)	화신	배지
버튼 그룹	버튼	카드
칩 (곧 출시)	무너지다	갤러리 (곧 출시)
Jumbotron (곧 출시)	링크	목록 그룹
알림 (곧 출시)	단락	자리 소유자
Popover (곧 출시)	진전	평가
위로 스크롤하십시오	소셜 버튼	스피너
타임 라인	토스트 (곧 출시)	툴팁 (곧 출시)
비디오 (곧 출시)	비디오 회전 목마 (곧 출시)	확인란
파일 입력	입력 그룹 (곧 출시)	로그인 양식
라디오	범위	등록 양식
찾다	선택 (곧 출시)	스위치
Textarea (곧 출시)	테이블	리플
애니메이션 (곧 출시)	마스크	그림자

---

설치

NPM

1. 프로젝트를 시작하기 전에 Node.js (LTS) 버전 14+, 16+ 및 Tailwindcss를 설치하십시오.

2. NPM을 통해 패키지를 설치하려면 다음 명령을 실행하십시오.

 npm i git+https://oauth2:[email protected]/mdb/twe-react/prd/twe-react-pro-essential

3. TW ELEMENTS 추가 CSS 파일을 기본 JS/TSX 파일에 반응합니다.

 import "tw-elements-react/dist/css/tw-elements-react.min.css" ;

4. Tw Elements는 플러그인이며 Tailwind.config.js 파일 내부에 포함되어야합니다. 동적 구성 요소 클래스를로드하는 JS 파일로 컨텐츠 배열을 확장하는 것이 좋습니다.

 module . exports = {
  content : [
    "./index.html" ,
    "./src/**/*.{js,ts,jsx,tsx}" ,
    "./node_modules/tw-elements-react/dist/js/**/*.js" ,
  ] ,
  theme : {
    extend : { } ,
  } ,
  darkMode : "class" ,
  plugins : [ require ( "tw-elements-react/dist/plugin.cjs" ) ] ,
} ;

5. 패키지를 가져온 후 구성 요소가 작동합니다.

 import { TECollapse } from "tw-elements-react" ;