Данный проект был создан с использованием Vue-CLI и предоставляет готовую структуру для разработки. Вот структура проекта:
├── build // Конфигурация сборки
├── config // Конфигурация сборки
└── src // Исходный код
├── assets // Статические ресурсы
├── components // Глобальные компоненты
├── element-ui // Компоненты Element UI
├── element-ui-theme // Тема Element UI
├── icons // Все SVG иконки
├── router // Маршрутизация
├── store // Глобальное управление хранилищем
├── utils // Общие методы
├── views // Представления
├── App.vue // Главный компонент
├── main.js // Точка входа
├── static // Ресурсы, не включенные в сборку
├── config // Глобальные переменные
├── img // Значок favicon
├── plugins // Плагины
├── .babelrc // Конфигурация Babel-loader
├── eslintrc.js // Конфигурационные параметры ESLint
├── .gitignore // Исключаемые файлы Git
├── index.html // Шаблон HTML
└── package.json // Файл пакета
Для установки зависимостей выполните следующие команды:
# Установка зависимостей
npm install
# Запуск сервера
npm run dev
В процессе установки могут возникнуть проблемы со скоростью или ошибки. В этом случае попробуйте выполнить следующие действия:
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install
# Запуск сервера
npm run dev
После запуска сервер автоматически откроет браузер по адресу http://localhost:8000.
Проект предлагает 12 цветовых тем для настройки внешнего вида с помощью Element UI. Для переключения между темами выполните следующие шаги:
Измените строку import './element-[#17b3a3]/index.css'
в файле /src/element-ui-theme/index.js, заменив значение в квадратных скобках на нужное вам. Это изменит тему компонентов Element UI.
Измените строку $--color-primary: [#17b3a3];
в файле /src/assets/scss/_variables.scss, чтобы изменить основную тему сайта.
Чтобы создать новую тему, используйте онлайн-инструмент генерации тем от Element UI, загрузите полученный файл и поместите его в каталог /src/element-ui-theme/. Затем настройте управление темами с помощью файла /src/element-ui-theme/index.js.
Измените файл /static/config/index-prod.js, указав базовый URL для запросов к бэкенду (например, window.SITE_CONFIG['baseUrl'] = 'http://ваш домен/platform-admin'
) и, если вы используете сторонние хранилища файлов, укажите CDN-адрес для доступа к статическим ресурсам (например, window.SITE_CONFIG['domain'] = 'cdn адрес'
).
Затем выполните команду npm run build
для создания оптимизированной версии приложения.
Конфигурация Nginx для развертывания может выглядеть следующим образом:
location / {
# Указывает на папку с собранными файлами
root /usr/local/nginx/dist;
index index.html;
}
location /platform-admin {
# Перенаправляет запросы на бэкенд
proxy_pass http://ваш домен:8890/platform-admin;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
location /platform-api {
# Перенаправляет запросы на API
proxy_pass http://ваш домен:8889/platform-api;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Опубликовать ( 0 )