vue-element-admin은 Vue.js와 Element-UI를 기반으로 한 백엔드 프론트엔드 솔루션입니다. 최신 프론트엔드 기술 스택을 채택하며, i18n 국제화 솔루션, 동적 라우팅, 권한 인증 등 내장 기능을 제공합니다. 전형적인 비즈니스 모델을 통해 다양한 기능 컴포넌트를 제공하여 개발자가 기업용 중앙 관리 시스템 제품 프로토타입을 빠르게 구축할 수 있도록 지원합니다.
주요 기능
vue-element-admin은 다음과 같은 뛰어난 기능을 갖추고 있습니다:
- 인증 시스템: 기본 로그인 및 로그아웃 기능
- 권한 관리: 페이지 권한, 지시어 권한, 권한 설정 및 2단계 인증 포함
- 다중 환경 배포: dev, sit, stage 및 prod 환경 지원
- 글로벌 기능: 다국어 지원, 동적 테마 변경, 동적 사이드바, 동적 네비게이션, 빠른 접속, SVG 아이콘 등
- 에디터: 리치 텍스트, 마크다운 및 JSON 형식의 다양한 에디터 내장
- Excel 처리: Excel 내보내기, 가져오기, 프론트엔드 시각화 및 ZIP 압축 내보내기 지원
- 테이블: 동적 테이블, 드래그 앤 드롭 테이블 및 인라인 편집 기능
- 오류 페이지: 401 및 404 오류 페이지 포함
- 컴포넌트: 프로필 업로드, 상단으로 이동, 드래그 가능한 Dialog, 드래그 가능한 Select, 드래그 가능한 칸반 보드 등 풍부한 컴포넌트 제공
- 통합 예제: 다양한 기능의 종합 적용 사례
- 오류 로깅, 대시보드, 가이드 페이지, ECharts 차트, 클립보드, 마크다운2HTML 등 실용적 기능
적용 분야
vue-element-admin은 다음과 같은 시나리오에 적합합니다:
- 기업용 중앙 관리 시스템
- 전자상거래 플랫폼 관리자
- 금융 시스템 관리자
- SaaS 플랫폼
- 권한 관리, 동적 라우팅, 국제화 등의 기능이 필요한 기타 시스템
사용 방법
- 프로젝트 복제
git clone https://github.com/PanJiaChen/vue-element-admin.git
- 의존성 설치
npm install
- 서비스 시작
npm run dev
- 프로젝트 접속
브라우저에서 http://localhost:9527에 접속합니다.
배포
테스트 환경 빌드:
npm run build:stage
프로덕션 환경 빌드:
npm run build:prod
유사 프로젝트
- vue-admin-template: 최소한의 관리자 기본 템플릿
- electron-vue-admin: Electron 기반의 데스크톱 관리 시스템
- vue-typescript-admin-template: TypeScript를 사용한 관리자 시스템 템플릿