OSCHINA-MIRROR/beijing_hongye_huicheng-lilishop-uniapp

Lilishop B2B2C 商城系统

商城介绍

Официальный сайт: https://pickmall.cn

Дополнительная информация: https://gitee.com/beijing_hongye_huicheng/lilishop/blob/master/README.md

Демонстрационный сайт: https://m-b2b2c.pickmall.cn/ Логин: 13011111111 Пароль: 111111

Lilishop-uniapp для мобильных устройств и небольших программ: отсканируйте QR-код.

Lilishop-uniapp как запустить на локальном компьютере H5 и в небольшой программе на WeChat

https://www.bilibili.com/video/BV17K8EemEh2/

Lilishop-uniapp как упаковать H5 на сервер

https://www.bilibili.com/video/BV1CX87exE64/

Быстрый старт

Чтение документации

uni-app: https://uniapp.dcloud.net.cn/api/

vue2: https://v2.cn.vuejs.org/

uView v1: https://v1.uviewui.com/

Среда разработки

Перед началом разработки убедитесь, что на вашем компьютере установлены следующие программы:

hbulider: https://www.dcloud.io/hbuilderx.html

Технологический стек

В этом проекте используются технологии uni-app, scss, ES2015 и uView. Предварительное изучение и понимание этих технологий поможет вам лучше разобраться в нашем проекте.

Установка

Клонируйте проект на свой компьютер.

git clone https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp.git

Откройте проект в hbulider.

Просто перетащите проект в hbulider и нажмите «Запустить».

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

├── api  // API
├── components  // Компоненты
├── config  // Файлы конфигурации
├── CustomStartPage  // Конфигурация запуска упакованного приложения
├── CustomStoryboard  // Стартовая страница iOS с пользовательской раскадровкой
├── hybrid  // Страница с рекламой
├── js_sdk  // Завёрнутый JS SDK
├── lib  // Некоторые методы завёрнуты
├── pages  // Страницы
├── plugins  // Плагины
├── static  // Статические ресурсы
├── store  // Vuex
├── utils  // Утилиты
├── uview-ui  // uView
├── App.vue  // Главная страница
├── main.js  // Главный файл
├── manifest.json  // Файл конфигурации hbulider
├── pages.json  // Файл конфигурации маршрутов
├── uni.scss  // Глобальные стили
└── vue.config.js  // Файл конфигурации Vue

Запуск

Запуск на H5

Откройте hbulider и нажмите Запустить → Запустить в браузере → Выберите свой браузер.

Запуск небольшой программы на WeChat

Вам потребуется установить WeChat Developer Tools на своём компьютере.

Ссылка: https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

Когда вы откроете hbulider, нажмите Запустить → Запустить небольшую программу в симуляторе → WeChat Developer Tools. При запуске вам нужно будет настроить AppID небольшой программы. После настройки вы сможете запустить её.

Запуск приложения

Запуск на Android

Откройте hbulider и нажмите Запустить → Запустить на телефоне или симуляторе → Симулятор приложения для Android.

Запуск на iOS

Откройте hbulider и нажмите Запустить → Запустить на телефоне или симуляторе → Симулятор приложения для iOS.

Настройка проекта / разработка

Настройка config

В корневом каталоге config находится каталог config, в котором определены некоторые параметры по умолчанию. Вы можете изменить их в соответствии со своими потребностями.

const name = "lilishop"; //全局商城name
const schemeName = "lilishop"; //唤醒app需要的schemeName
export default {
  name: name,
  schemeLink: `${schemeName}://`, //唤起app地址
  downloadLink: "https://pickmall.cn/download-page/index.html", //下载地址，下载app的地址
  shareLink: "https://m-b2b2c.pickmall.cn", //分享地址，也就是在h5中默认的复制地址
  appid: "", //小程序唯一凭证，即 AppID，可在「微信公众平台 - 设置 - 开发设置」页中获得。（需要已经成为开发者，且帐号没有异常状态）
  aMapKey: "", //在高德中申请Web服务key
  scanAuthNavigation: ["https://m-b2b2c.pickmall.cn/"], //扫码认证跳转域名配置 会根据此处配置的路由进行跳转
  iosAppId: "id1564638363", //AppStore的应用地址id 具体在分享->拷贝链接中查看
  logo: "https://lilishop-oss.oss-cn-beijing.aliyuncs.com/4c864e133c2944efad1f7282ac8a3b9e.png", //logo地址
  customerServiceMobile: "13161366885", //客服电话
  customerServiceEmail: "lili@lili.com", //客服邮箱
  imWebSrc: "https://im.pickmall.cn", //IM地址
  baseWsUrl: "wss://im-api.pickmall.cn/lili/webSocket", // IM WS 地址
  enableGetClipboard: false, //是否启用粘贴板获取 scanAuthNavigation 中的链接，如果匹配则会跳转到对应页面
  enableMiniBarStartUpApp: true, //是否在h5中右侧浮空按钮点击启动app
  /**
   * 如需更换主题请修改此处以及uni.scss中的全局颜色
   */
  mainColor: "#ff3c2a", // 主题色
  lightColor: "#ff6b35", // 高亮主题色
  aiderLightColor: "#ff9f28", // 辅助高亮颜色
  defaultUserPhoto: "/static/missing-face.png", // 默认用户头像
  enableFetchMobileLogin: false // 是否启用获取手机号登录 如果微信小程序提示封禁手机号获取权限 可将此选项设置成false作为备用登录方案
};

Компоненты

В каталоге components корневого каталога находятся компоненты. Вы можете изменять их в соответствии с вашими потребностями или читать документацию по компонентам и README.md.

Страницы

Код страницы находится в каталоге pages. В файле pages.json настроена маршрутизация страниц. Подробные сведения о настройке см. в pages.json или документации uni-app.

Для небольших программ на WeChat по умолчанию включена функция разделения кода. Если вам нужна эта функция в небольшой программе, вам необходимо настроить путь разделения кода в pages.json. Подробные сведения о настройке см. в pages.json или документации uni-app.

Тема

Сейчас в config задана основная тема.
В uni.scss заданы глобальные цвета.
Замените некоторые иконки и изображения в проекте на цвета темы.

Часто задаваемые вопросы

Ошибка при запуске небольшой программы на WeChat для мобильного устройства

Ошибка прямой трансляции небольшого плагина программы. Удалите код в manifest.

Ошибка запуска

Не удаётся загрузить файл размером более 2 МБ в небольшую программу на WeChat

Закройте небольшую программу WeChat и остановите её работу.
Снова нажмите кнопку «Запустить симулятор небольшой программы» и отметьте флажок «Сжимать код во время выполнения» в нижней части экрана. Затем снова запустите.
Если по-прежнему появляется сообщение об ошибке, превышающей 2 МБ, повторите шаг 1, затем нажмите «Распространить» → «Небольшая программа», чтобы продолжить.
Если шаги 1–3 не работают, вы можете попробовать удалить некоторый код, который вы разработали самостоятельно, или статические ресурсы изображений на вашем компьютере.

В небольшой программе на WeChat можно использовать интерфейс в тестовой версии, но нельзя в рабочей версии

Прежде всего, убедитесь, что вы ввели действительный домен запроса в настройках WeChat.
Запрос должен быть HTTPS.

Действительные домены запросов для небольших программ на WeChat следующие:

https://buyer-api.pickmall.cn
https://common-api.pickmall.cn
https://im-api.pickmall.cn
https://restapi.amap.com

Домены действительных запросов WebSocket:

... Вот перевод текста на русский язык:

#### Как настроить API
В корневом каталоге `config` -> `api` настройте адреса интерфейсов API для среды разработки и рабочей среды.

#### Ошибки при запуске
При первом запуске может возникнуть ошибка из-за отсутствия компиляционных плагинов в локальной среде. В этом случае необходимо внимательно изучить сообщение об ошибке и установить соответствующий плагин.

#### Настройка appid для приложения в WeChat
Настройте appid приложения в WeChat в файле `manifest.json` в корневом каталоге.

#### Ошибка при входе через WeChat
Проверьте правильность настройки appId. Убедитесь, что в бэкенде правильно настроены `appId` и `appSecret` для доверенного входа.