VueNext-ElementPlus-Admin

⚡ Введение

VueNext-ElementPlus-Admin — это решение для бэкенда на основе Vue 3.x и Element-Plus. Оно использует передовые технологии фронтенда, включает динамические маршруты, аутентификацию, абстрагирует типичные бизнес-модели, обеспечивает модульное проектирование и предоставляет широкий спектр функциональных компонентов. В нём также встроено решение i18n для интернационализации и поддерживается Vite для быстрого запуска сервисов и быстрой перезагрузки «на лету», что повышает эффективность разработки. Это помогает быстро создавать прототипы корпоративных продуктов для среднего и заднего уровня.

Лёгкая структура проекта сохраняет только основные функции, избегая избыточности и ненужных функций. Она позволяет гибко расширять функциональность в соответствии с требованиями бизнеса и быстро разрабатывать индивидуальные приложения для бэкэнда.

Обратите внимание: проект не поддерживает браузер IE.

💒 Характеристики

• ⚡️ Скорость
• 🍃 Лёгкость
• 🧱 Модульность
• 📦 Богатые компоненты
• 🚀 Высокая расширяемость
• 📠 Typescript
• 🌈 Tsx/Jsx
• 🌎 Интернационализация

🎯 Подготовка

Для использования этого проекта необходимо установить Node и Git на локальном компьютере. Проект основан на ES2016+, Vue 3.x, Pinia, Vue-Router@next, Vite, Axios и Element-Plus, поэтому предварительное изучение этих технологий поможет в работе с проектом.

Документация

Доступна китайская документация (постоянно обновляется) по адресу http://doc.yuetchn.top.

Примеры

Перейдите по ссылке, чтобы увидеть примеры: http://demo.yuetchn.top .

Связанные ссылки

Gitee: https://gitee.com/yuetchn_admin/VueNext-ElementPlus-Admin GitHub: https://github.com/yuetchn/VueNext-ElementPlus-Admin

🏭 Функции

• ✅ Маршруты (статические и динамические)
• ✅ Кэш
• ✅ Богатые компоненты
• ✅ Аутентификация (меню, кнопки, функции)
• ✅ Много переменных окружения
• ✅ Интернационализация (i18n)
• ✅ Utils

Volar

Volar — расширение для поддержки языка Vue 3, которое обеспечивает быструю и эффективную работу с языком. Обратите внимание, что этот плагин конфликтует с Vetur, и перед его использованием необходимо отключить Vetur.

🔌 Серверная часть

В настоящее время происходит переход от фиктивных сервисов к реальным. Новый бэкенд написан на языке Go и находится в стадии завершения разработки. Планируется объединить бэкэнд с текущим проектом и сделать его открытым исходным кодом.

Структура каталогов

├── public
│   ├── tinymce
│   │   ├── langs
│   │   └── skins
│   └── favicon.ico
├── src
│   ├── api
│   │   ├── v1
│   │   ├── login.ts
│   │   └── user.ts
│   ├── assets
│   │   ├── icons
│   │   ├── imgs
│   │   ├── style
│   │   └── logo.png
│   ├── components
│   │   ├── Charts
│   │   ├── Dialog
│   │   ├── Editor
│   │   ├── Link
│   │   ├── LoadingShade
│   │   ├── MarkDown
│   │   ├── Page
│   │   ├── QrCode
│   │   ├── SvgIcon
│   │   ├── Table
│   │   ├── index.scss
│   │   └── index.ts
│   ├── directive
│   │   ├── src
│   │   └── index.ts
│   ├── layout
│   │   ├── components
│   │   └── Layout.vue
│   ├── locale
│   │   ├── en-US.ts
│   │   ├── index.ts
│   │   └── zh-CN.ts
│   ├── hooks
│   │   ├── src
│   │   └── index.ts
│   ├── mock
│   │   ├── user
│   │   └── index.ts
│   ├── router
│   │   ├── modules
│   │   ├── index.ts
│   │   └── static.ts
│   ├── store
│   │   ├── app.ts
│   │   ├── user.ts
│   │   ├── viewTag.ts
│   │   └── index.ts
│   ├── types
│   │   ├── axios
│   │   ├── components
│   │   ├── global
│   │   ├── request
│   │   └── router
│   ├── utils
│   │   ├── cache
│   │   ├── excel
│   │   ├── func
│   │   ├── cookie.ts
│   │   ├── global.ts
│   │   └── permission.ts
│   ├── views
│   │   ├── 404
│   │   ├── components
│   │   ├── dashboard
│   │   ├── login
│   │   ├── Redirect
│   │   └── systemManage
│   ├── App.vue
│   ├── env.d.ts
│   └── main.ts
├── .env
├── .env.development
├── .env.production
├── .eslintrc.js
├── .tslint.json
├── index.html
├── LICENSE
├── package.json
├── README.md
├── tsconfig.json
└── vite.config.ts

Разработка

🚧 Разработка

# 1. Извлеките код из репозитория на свой компьютер.
git clone https://gitee.com/yuetchn_admin/VueNext-ElementPlus-Admin

# 2. Перейдите в каталог проекта.
cd VueNext-ElementPlus-Admin

# 3. Установите зависимости.
npm i
or
yarn

# 4. Запустите проект.
npm run dev
или
yarn dev

# 5. Запустите проект в рабочей среде.
npm run serve
или
yarn serve **Обзор**

Публикация

# Сборка в среде разработки
npm run build:dev
или
yarn build:dev

# Сборка для продакшена
npm run build:prod
или
yarn build:prod

Прочее

# Проверка кода
npm run lint
или
yarn lint

🍕 Поддержка автора

Если вы используете или использовали этот фреймворк и считаете его хорошим, то буду признателен, если вы поставите ⭐ Star. Это будет большой поддержкой для меня.

License

MIT

Copyright (c) 2023-present YuetChn