BAI_SHOP
1.0.0
Введение в проект: В этом проекте используется модель разделения внешнего и внутреннего интерфейса. vue_api_server — это файл внутреннего кода, vue_shop — файл кода внешней разработки, а vue_shop_server — файл производственного кода внешнего интерфейса. , запустить vue_shop_server напрямую будет намного проще, чем vue_shop
| Стек технологий фронтенд-проекта | иллюстрировать |
|---|---|
| Вю | Прогрессивная платформа для создания пользовательских интерфейсов. |
| Vue-роутер | vue-router — официальный менеджер маршрутизации vue.js. |
| Элемент-UI | ElementUI Element — это библиотека компонентов на основе Vue 2.0, предназначенная для разработчиков, дизайнеров и менеджеров по продуктам. Она предоставляет вспомогательные ресурсы для дизайна, которые помогут вашему веб-сайту быстро обрести форму. |
| Аксиос | axios — это Http-библиотека на основе Promise, которую можно использовать в средах node.js и браузерах. |
| Эчартс | Проще говоря, ECharts — это плагин, используемый внутренней базой данных для сопоставления данных с графикой в процессе разработки программ Интернета. |
| Стек технологий бэкэнд-проекта | иллюстрировать |
|---|---|
| Node.js | nodejs — это язык, разработанный на C++, который работает на стороне сервера. Он может писать фоновые программы для веб-сайтов и разрабатывать серверные приложения. |
| Выражать | Express — это минималистичная и гибкая среда разработки веб-приложений, основанная на платформе Node.js. Она предоставляет ряд мощных функций, которые помогут вам создавать различные веб-приложения и приложения для мобильных устройств. |
| wxya | Веб-токен json — это открытый стандарт на основе json, реализованный для доставки утверждений в среде веб-приложений. |
| MySQL | база данных |
| секвелизировать | Sequelize.js обеспечивает простой доступ к базам данных MySQL, MariaDB, SQLite и PostgreSQL путем сопоставления записей базы данных с объектами или объектов с записями базы данных. Короче говоря, это ORM (Object-Relational-Mapper). Sequelize.js полностью написан на JavaScript и подходит для сред Node.js. |
configdefault.json (который содержит конфигурацию базы данных, конфигурацию jwt)dao , на котором хранятся операции добавления, удаления, изменения и запроса базы данных.DAO.jsmodels хранят определенные файлы моделей базы данных ORM.modules проектаauthorization.jsdatabase.js (загрузка базы данных основана на загрузке библиотеки nodejs-orm2)passport.js построен на основе модуля входа в паспорт.resextra.jsnode_modulesroutesapi предоставляет интерфейс APImapp предоставляет интерфейс мобильного приложенияmweb предоставляет мобильные веб-сайтыservices , на этом уровне пишется код бизнес-логики, а данные, полученные через разные интерфейсы, преобразуются в данные, необходимые для единого интерфейса.app.jspackage.json папка dist Папка, созданная после упаковки проекта (для производственной среды).
css , fonts , img , js , favicon.ico и index.html В public папке хранятся статические ресурсы.
favicon.ico и index.html Папка src — это папка, в которой хранится исходная программа.
assets : хранит некоторые более крупные файлы ресурсов проекта, такие как изображения, шрифты и т. д.
components : хранит подкомпоненты проекта vue.
plugins : компоненты element-ui представленные в проекте.
router : маршрутизация проекта index.js
tools : класс инструментов проекта
App.vue : корневой компонент vue.
main.js : веб-вход
Другие файлы конфигурации
.browserslistrc : эта конфигурация может использовать целевой браузер и версию nodejs в разных интерфейсных инструментах. Эти инструменты могут автоматически настраиваться в соответствии с целевым браузером..editorconfig : помогает разработчикам определять и поддерживать согласованные стили кодирования в разных редакторах и IDE..eslintignore : установка файлов, которые не проверены eslint ( ESLint — это подключаемый модуль и настраиваемое правило грамматики JavaScript и инструмент проверки стиля кода)..eslintrc.js : файл конфигурации eslint..gitignore : установить файлы, игнорируемые git..prettierrc : когда мы используем форматирование правой кнопкой мыши, это автоматически помогает нам заполнить символы. Однако некоторые символы сообщают о синтаксических ошибках в eslint, так что нам нужно сделать? Вы можете настроить файл через .prettierrc.babel.config.js : файл конфигурации Babel ( Babel — это цепочка инструментов, в основном используемая для преобразования кода версии ECMAScript 2015+ в обратно совместимый синтаксис JavaScript, чтобы он мог работать в текущих и более старых версиях браузеров или других средах)vue_shop в папке dist .css , fonts , img , js , favicon.ico и index.htmlnode_modules , затем войдите в каталог vue_shop_server и выполните npm install , чтобы повторно загрузить новый пакет зависимостей.nodemon app.js в окне документа и посетите http://localhost:3000 чтобы увидеть интерфейсную страницу проекта.app.js запускает файл ввода, который содержит некоторые базовые конфигурации сервера. 1. Загрузите и разархивируйте BAI_SHOP.zip
2. Войдите в папку vue_api_server/db и импортируйте файл базы данных mydb.sql из папки db в базу данных mysql.
3. После успешного импорта данных откройте файл default.json в папке config и настройте в нем db_config .
4. Откройте командное окно документа, войдите в каталог vue_api_server и запустите команду npm install чтобы загрузить зависимости, необходимые для проекта.
5. После загрузки зависимостей запустите nodemon app.js , чтобы запустить
6. Откройте новое командное окно документа, войдите в каталог vue_shop и запустите команду npm install чтобы загрузить зависимости, необходимые для проекта.
7. После загрузки зависимостей запустите команду npm run serve в текущем окне, чтобы запустить проект. Когда появится сообщение Compiled successfully in xxxxms , откройте браузер и посетите localhost:8080
8. Постскриптум: В целом проекты в режиме разработки работают успешно! Примечание. Сначала у вас должна быть среда nodejs! И вам необходимо установить код зависимости nodemon глобально: npm install nodemon -g
Если вы хотите смонтировать проект в производственном режиме, см. описание файла vue_shop и описание файла vue_shop_server выше. Папка dist — это файл после упаковки проекта vue. Вам нужно только смонтировать его на сервере.
