В течение последних шести месяцев я занимался разработкой панели управления для администратора с использованием Vue. Несмотря на то, что панель управления включает более 70 страниц и свыше 10 разрешений, поддержка проекта требует минимальных усилий. Поэтому я решил сделать его открытым, чтобы поделиться своим опытом и прогрессом в разработке панели управления. Технологический стек в основном состоит из Vue.js+Element+axios. Поскольку это личный проект, все запросы данных эмулируются с помощью Mock.js. Примечание: если кто-то хочет модифицировать или развивать этот проект, пожалуйста, удалите файлы мока.
Демо: http://panjiachen.github.io/vue-element-admin
Примечание: в проекте используется element-ui@1.4.2, поэтому требуется vue 2.3.0+
# Клонировать проект
git clone https://github.com/PanJiaChen/vue-element-admin.git
# Установить зависимости
npm install
# Или (не рекомендуется использовать cnpm из-за неизвестных багов, используйте зеркало Taobao)
npm install --registry=https://registry.npm.taobao.org
# Запустить локальный сервер разработки
npm run dev
Открыть в браузере: http://localhost:9527
# Сборка стадийной среды с webpack-bundle-analyzer
npm run build:sit-preview
# Сборка продакшн среды
npm run build:prod
├── build // сборка
├── config // конфигурация
├── src // исходный код
│ ├── api // все запросы
│ ├── assets // статические ресурсы, такие как темы, шрифты
│ ├── components // глобальные публичные компоненты
│ ├── directive // глобальные директивы
│ ├── filters // глобальные фильтры
│ ├── mock // моковые данные
│ ├── router // маршрутизация
│ ├── store // глобальное управление состоянием
│ ├── styles // глобальные стили
│ ├── utils // глобальные публичные функции
│ ├── view // представления
│ ├── App.vue // входное представление
│ └── main.js // входной файл для загрузки компонентов, инициализации
├── static // сторонние библиотеки, не упакованные Webpack'ом
│ └── Tinymce // редактор богатого текста
├── .babelrc // конфигурация babel-loader
├── eslintrc.js // конфигурация eslint
├── .gitignore // gitignore
├── favicon.ico // favicon
├── index.html // HTML шаблон
└── package.json // package.json
Детальные изменения для каждой версии документированы в заметках о выпуске.
Если вы считаете этот проект полезным, вы можете купить мне чашку кофе
Состояние пользователя и конфигурации приложения управляется Vuex. Остальные данные управляются на своих собственных бизнес-страницах.
http://panjiachen.github.io/vue-element-admin
MIT
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )