diff --git a/docs/docs/baota_install.md b/docs/docs/baota_install.md deleted file mode 100644 index 95c9286..0000000 --- a/docs/docs/baota_install.md +++ /dev/null @@ -1,925 +0,0 @@ -## 约定 - -- 操作系统：Centos 7.x x64 -- 操作权限：root -- 宝塔面板：[宝塔Linux面板 7.9](https://www.bt.cn/bbs/thread-19376-1-1.html) -- 以下安装仅供参考，也可自行安装，关键配置对照文档即可。 - -## 软件版本清单 - -- supervisorctl > 2.0 -- mysql 5.7或者更高版本 -- nginx -- node = 16.16.0 & 20.19.0(PC商城必须) -- redis > 4.0 -- php 8.2 - -## 文档示例中主要配置展示 - -**注意：根据实际情况修改对应目录、域名、数据库配置、redis配置、其他配置等等！** - -**如果使用小程序，域名一定是要https协议的，所以参照文档的时候，注意跳转http、https等是否一致** - -***生产环境一定要全部用https协议*，这里ecshopx.demo.com是我绑定了本地hosts来使用，所以如果没有域名，也可以这样做绑定本地hosts吧。** - -```bash -● 测试域名 -ecshopx.demo.com -● 测试H5域名 -ecshopx-h5.demo.com -● 代码主目录 -/www/wwwroot/ecshopx.demo.com -● php代码目录 -/www/wwwroot/ecshopx.demo.com/ECShopX -● 管理后台代码目录 -/www/wwwroot/ecshopx.demo.com/ECShopX_admin-frontend -● H5代码目录 -/www/wwwroot/ecshopx.demo.com/ECShopX_mobile-frontend -● PC代码目录 -/www/wwwroot/ecshopx.demo.com/ECShopX_desktop-frontend -● php的配置文件位置 -/www/wwwroot/ecshopx.demo.com/ECShopX_-frontend/.env -``` - -## 安装宝塔Linux面板 - -本文档编写时基于宝塔Linux面板 7.9.1版本，本文不做宝塔面板本身的安装教程。具体可以点击下面链接参照宝塔官方文档安装宝塔面板，并且需要按照宝塔的要求进行基础设施搭建 - -[https://www.bt.cn/bbs/thread-19376-1-1.html](https://www.bt.cn/bbs/thread-19376-1-1.html) - -> **附宝塔安装要求（摘自官方）：** -> -> 内存：512M以上，推荐768M以上（纯面板约占系统60M内存） -> -> 硬盘：300M以上可用硬盘空间（纯面板约占20M磁盘空间） -> -> 系统：CentOS 7.1+ (Ubuntu16.04+.、Debian9.0+)，**确保是干净的操作系统，没有安装过其它环境带的Apache/Nginx/php/MySQL/pgsql/gitlab/java（已有环境不可安装）** -> -> 架构：x86_64（主流服务器均是此架构），ARM不完整兼容（面板环境安装慢，部分软件可能安装不上） - -## 基础软件部署 - -### 安装PHP-8.2 -![](../assets/bt01.png) - -### 安装扩展fileinfo -composer install 的时候需要这个php扩展，在php管理面板中安装此扩展，并重启php - -![](../assets/bt02.png) - -### 删除部分php被禁用函数 -在php管理面板中的`禁用函数`菜单中删除以下被禁用函数 - -> `putenv` -> -> `shell_exec` -> -> `symlink` -> -> `proc_open` -> -> `pcntl_alarm` -> -> `pcntl_fork` -> -> `pcntl_wait` -> -> `pcntl_signal` -> -> `pcntl_signal_dispatch` - -### 安装composer - -> 默认composer源网站是在国外，国内访问速度慢，这里换成国内的阿里云的composer镜像源 - -在终端中执行以下命令安装php的包管理工具 composer - -![](../assets/bt03.png) - -```bash -curl -sS https://getcomposer.org/installer | php -- --install-dir=/usr/bin --filename=composer -/usr/bin/composer config -g repo.packagist composer https://mirrors.aliyun.com/composer/ -``` - -安装好后在终端中执行以下命令检查是否安装好 - -### 安装Nginx - -> 本文选择的是nginx1.20版本 - -![](../assets/bt04.png) - -### 安装MySQL - -> 本文选择的是mysql5.7.37版本，一般mysql8.0也是可以的 - -![](../assets/bt05.png) - -### 添加数据库 - -在宝塔面板`**数据库**`中，点击`**添加数据库**`**，**填写对应的数据库名、用户名、密码，字符编码选择 `**utf8mb4**`**，**添加好数据库后，安装应用的时候需要配置进去，所以需要记下来对应配置 - -![](../assets/bt06.png) - -例如我们这里设置成`数据库名：ecshopx，用户名：ecshopx，密码：ecshopx123` - -### 安装phpMyAdmin - -> 本文选择的是phpMyAdmin 5.0.0 Stable版本，宝塔默认通过phpmyadmin管理mysql - -![](../assets/bt07.png) - -### 安装Redis - -> 本文选择的是redis 6.2.6版本 - -![](../assets/bt08.png) - -修改redis密码 - -打开redis管理界面，点击`配置文件`，搜索 `requirepass`,取消这一行的注释，然后修改redis密码 - - -![](../assets/bt09.png) -例如我们修改为 - -```bash -requirepass 123456 -``` - -然后保存并重启redis - -### 安装Supervisor管理器 - -本文选选择的是supervisor 2.2版本 - -![](../assets/bt10.png) - -### 安装nodejs - -本文选择的是PM2管理器2，node.js管理器，内置 node.js + npm + nvm + pm2.! - -![](../assets/bt11.png) - -在宝塔后台修改node版本，建议在宝塔后台选择版本，下文还有终端修改的命令 - -![](../assets/bt12.png) - -在终端中修改版本，终端中直接改，下次再进终端，版本又会变成v16，这里需要注意 - -```bash -使用nvm安装版本v16的node -nvm install v16.16.0 - -切换成v16版本的node -nvm use v16.16.0 - -查看版本 -node -v -``` - -如下，版本显示 v16.16.0，下文安装编译管理后台和H5都需要v16版本的node - -![](../assets/bt13.png) - -**注意：在终端中可能每次重新打开后node版本又会变掉，这里需要注意，每次执行node命令需要检查一次node版本是否为v16** - -## 系统应用部署 - -代码部署分以下几部分 - -> 系统是前后端分离的。 -> -> API服务(PHP开发，提供api服务) -> -> 平台管理端(VUE开发) -> -> 小程序/H5端(TARO开发) - -### 部署API服务(php) - -- 克隆代码 - -```bash -git clone https://gitee.com/ShopeX/ECShopX.git -``` - -- 修改目录权限为www，因为宝塔站点默认权限是www - -```bash -chown -R www:www /www/wwwroot/ecshopx.demo.com/ECShopX -``` - -- 进入目录 - -```bash -cd /www/wwwroot/demo.ecshopx.com/ECShopX -``` - -- 安装composer包 - -```bash -# 安装composer包 -composer install -``` - -- 生成配置文件 - -```bash -# 生成env配置文件 -# .env.full 文件是完整配置，.env.example 文件是基础配置。 -cp .env.example .env -``` - -- **生成APP_KEY密钥** - -> 注意：2.8.0及以后版本才有这个命令，之前的需要手动修改.env中的APP_KEY配置 - -```bash -# 生成密钥,用于敏感数据加密等使用 -php artisan key:generate -``` - -- **生成api token密钥** - -```bash -# 生成api token密钥 -php artisan jwt:secret -``` - -- **配置域名** - -> **注意：这个一定要配置正确，是后台php访问域名，许多配置依赖于此** - -```bash -# 修改成您访问php对应的域名，例如我的后台域名是：https//ecshopx.demo.com -APP_URL=http://ecshopx.demo.com -``` - -- **配置MYSQL数据库** - -```bash -# 数据库相关配置 -## DB_CONNECTION默认不需要改 -DB_CONNECTION=default -DB_HOST=127.0.0.1 -DB_PORT=3306 -DB_DATABASE=ecshopx -DB_USERNAME=ecshopx -DB_PASSWORD=ecshopx123 -``` - -- **配置REDIS** - -```bash -# REDIS配置 -REDIS_CLIENT=predis -REDIS_HOST=127.0.0.1 -## 必须要设置密码 -REDIS_PASSWORD=123456 -REDIS_PORT=6379 -## 如果按照服务配置，则参考config/database.php中redis部分进行配置，并注释下面这条默认项，按需配置 -REDIS_DATABASE=0 -``` - -- 配置云存储 - -> 默认使用阿里云的OSS云存储，存储图片、视频、上传私有文件等，如果没有云存储可以跳过配置下一步的本地存储 - -```bash - -# 文件存储相关配置 -## oss(阿里云OSS)、qiniu(七牛云)、aws(亚马逊s3)、local(本地存储) -DISK_DRIVER=oss -## 当前客户文件存放目录 -OSS_PROJECT_NAME=default_project - -## OSS密钥配置 -OSS_ACCESS_KEY= -OSS_SECRET_KEY= - -## OSS私有文件配置 -OSS_FILE_ENDPOINT=https://oss-cn-shanghai.aliyuncs.com -### OSS私有文件存储bucket -OSS_FILE_BUCKET=oss-cdn -### 是否开启cname，私有文件不需要开 -OSS_FILE_IS_CNAME=false - -## OSS公共读图片配置 -OSS_IMAGE_ENDPOINT=https://oss-cn-shanghai.aliyuncs.com -### OSS公有图片bucket -OSS_IMAGE_BUCKET=oss-cdn -### 是否开启cdn -OSS_IMAGE_IS_CNAME=false -### 图片cdn,开启cdn则该配置必填 -OSS_IMAGE_DOMAIN= - -## OSS公共读视频配置 -OSS_VIDEO_ENDPOINT=https://oss-cn-shanghai.aliyuncs.com -### OSS公有视频bucket -OSS_VIDEO_BUCKET=oss-cdn -### 是否开启cdn -OSS_VIDEO_IS_CNAME=flase -### 视频cdn,开启cdn则该配置必填 -OSS_VIDEO_DOMAIN= -``` - -- 配置本地存储 - -> 如果还没有云存储，也可以配置本地存储 - -```bash -# 会在public目录下生成一个连接storage目录的软连 -php artisan storage:link -``` - -> 修改存储驱动为 - -```bash -# 文件存储相关配置 -## oss(阿里云OSS)、qiniu(七牛云)、aws(亚马逊s3)、local(本地存储) -DISK_DRIVER=local -``` - -- 配置支付通知接口（以微信支付为例） - -> 2.8.0及以后的版本可以不配置，只用配置APP_URL即可 - -```bash -WECHAT_PAYMENT_NOTIFY=https://您的网址/wechatAuth/wxpay/notify -``` - -- 完整的例子 - -```bash -# 应用名称 -APP_NAME=EcshopX2.0 -# 标识应用环境, 本地环境设置为local,生产环境为production -APP_ENV=local -# 数据加密密钥 -APP_KEY= -# 调试模式, 正式环境需要关闭(true,false) -APP_DEBUG=true -# php访问域名，不要带最后的斜杠，一定要配置 -APP_URL=http://ecshopx.demo.com -# 时区不要修改 -APP_TIMEZONE=PRC - -# 数据库相关配置 -## DB_CONNECTION默认不需要改 -DB_CONNECTION=default -DB_HOST=127.0.0.1 -DB_PORT=3306 -DB_DATABASE=ecshopx -DB_USERNAME=ecshopx -DB_PASSWORD=ecshopx123 - -# REDIS配置 -REDIS_CLIENT=predis -REDIS_HOST=127.0.0.1 -## 必须要设置密码 -REDIS_PASSWORD=123456 -REDIS_PORT=6379 -## 如果按照服务配置，则参考config/database.php中redis部分进行配置，并注释下面这条默认项，按需配置 -REDIS_DATABASE=0 - -# 文件存储相关配置 -## oss(阿里云OSS)、qiniu(七牛云)、aws(亚马逊s3)、local(本地存储) -DISK_DRIVER=local -## 当前客户文件存放目录 -OSS_PROJECT_NAME=default_project - -## OSS密钥配置 -OSS_ACCESS_KEY= -OSS_SECRET_KEY= - -## OSS私有文件配置 -OSS_FILE_ENDPOINT=https://oss-cn-shanghai.aliyuncs.com -### OSS私有文件存储bucket -OSS_FILE_BUCKET=oss-cdn -### 是否开启cname，私有文件不需要开 -OSS_FILE_IS_CNAME=false - -## OSS公共读图片配置 -OSS_IMAGE_ENDPOINT=https://oss-cn-shanghai.aliyuncs.com -### OSS公有图片bucket -OSS_IMAGE_BUCKET=oss-cdn -### 是否开启cdn -OSS_IMAGE_IS_CNAME=false -### 图片cdn,开启cdn则该配置必填 -OSS_IMAGE_DOMAIN= - -## OSS公共读视频配置 -OSS_VIDEO_ENDPOINT=https://oss-cn-shanghai.aliyuncs.com -### OSS公有视频bucket -OSS_VIDEO_BUCKET=oss-cdn -### 是否开启cdn -OSS_VIDEO_IS_CNAME=flase -### 视频cdn,开启cdn则该配置必填 -OSS_VIDEO_DOMAIN= - -# 微信第三方平台配置，本地开发环境不配置, 会影响到调用微信的相关页面, 整体不影响后台开发。 -## 第三方平台APPID -WECHAT_APPID= -## 第三方平台SECRET -WECHAT_SECRET= -## 消息校验Token -WECHAT_TOKEN= -## 消息加解密Key -WECHAT_AES_KEY= -## 是否需要服务号，false则需要自己绑定到开放平台 -WX_OPEN_THIRD=true -## 是否需要第三方平台 -WXA_NEED_OPEN_PLATFORM=true - -## 支付宝配置 -ALIPAY_PAYMENT_RETURN_H5=https://h5域名 - -# JWT相关配置，通过php artisan jwt:secret生成密钥，线上务必重新生成 -JWT_SECRET=ker4H1Gp4TsddddWJMac2SMA8Zsh3drv -JWT_TTL=7200 -JWT_REFRESH_TTL=20160 - -# 缓存驱动, 默认使用redis -CACHE_DRIVER=redis - -# 队列驱动, 默认使用redis -QUEUE_DRIVER=redis - -# 是否saas -SYSTEM_IS_SAAS=false -# 设置系统主要的企业id，用于pc和h5 -SYSTEM_MAIN_COMPANYS_ID=1 -# 是否使用系统菜单,false则是固定菜单，true则更新storage/static/目录下的菜单 -USE_SYSTEM_MENU=true -# 系统版本 -PRODUCT_MODEL=platform - -# 腾讯地图接口KEY, 建议根据项目进行申请 -QQMAP_KEY= -# 腾讯地图配置, 建议根据项目进行申请 -API_TENCENT_POSITION_APP_KEY= -API_TENCENT_POSITION_APP_SECRET= - -# 高德地图key -AMAP_LBS_KEY= - -# 汇付企账通相关配置 -## true启用汇付支付渠道其他支付渠道则隐藏 -HFPAY_IS_OPEN=false - -# 达达同城配送相关配置 -DADA_APP_KEY= -DADA_APP_SECRET= -DADA_IS_ONLINE=true - -# 是否加密敏感数据，配合配置APP_KEY使用 -ENCRYPT_SENSITIVE_DATA=false -``` - -#### 更新数据库 - -- 数据库迁移(将表和初始化数据更新到数据库中) - -```bash -php artisan doctrine:migrations:migrate -``` - -#### 配置定时任务 - -- 在面板`计划任务`菜单中，添加一个计划任务如下，每分钟跑一次 - -```bash -sudo -E -u www php /www/wwwroot/ecshopx.demo.com/ECShopX/artisan schedule:run >> /www/wwwroot/ecshopx.demo.com/ECShopX/storage/logs/ecshopx-cront.log 2>&1 -``` - -- 添加上述脚本内容后保存 - -![](../assets/bt15.png) - -#### 配置队列服务 - -- 打开`Supervisor管理器`界面，点击`添加守护进程`，如下界面 - -![](../assets/bt16.png) - -- 例如添加队列 - -名称：`ecshopx-queue-default` - -启动用户：`www` - -运行目录选择php目录： `/www/wwwroot/ecshopx.demo.com/ECShopX` - -启动命令：`php artisan queue:work --queue=default --delay=3 --memory=128 --timeout=30 --sleep=1 --tries=3` - -进程数量：`1` - -点击确定，然后在`守护进程管理菜单`启动队列 - -![](../assets/bt17.png) - -- 添加默认队列：`ecshopx-queue-default` - -```bash -[program:ecshopx-queue-default] -command=/www/wwwroot/ecshopx.demo.com/ECShopX/artisan queue:work --queue=default --delay=3 --memory=128 --timeout=30 --sleep=1 --tries=3 -stdout_logfile=/www/wwwroot/ecshopx.demo.com/ECShopX/storage/logs/supervisor-bloated-queue-default.log -redirect_stderr=true -process_name=%(program_name)s_%(process_num)02d -autostart=true -autorestart=true -numprocs=1 -user=www -startsecs=3 -startretries=100000 -``` - -- 添加慢队列：`ecshopx-queue-slow` - -```bash -[program:ecshopx-queue-slow] -command=/www/wwwroot/ecshopx.demo.com/ECShopX/artisan queue:work --queue=slow --delay=3 --memory=128 --timeout=1800 --sleep=1 --tries=3 -stdout_logfile=/www/wwwroot/ecshopx.demo.com/ECShopX/storage/logs/supervisor-bloated-queue-slow.log -redirect_stderr=true -process_name=%(program_name)s_%(process_num)02d -redirect_stderr=true -autostart=true -autorestart=true -numprocs=1 -user=www -startsecs=3 -startretries=100000 -``` - -- 添加短信队列：`ecshopx-queue-sms` - -```bash -[program:ecshopx-queue-sms] -command=/www/wwwroot/ecshopx.demo.com/ECShopX/artisan queue:work --queue=sms --delay=3 --memory=128 --timeout=1800 --sleep=1 --tries=3 -stdout_logfile=/www/wwwroot/ecshopx.demo.com/ECShopX/storage/logs/supervisor-bloated-queue-sms.log -redirect_stderr=true -process_name=%(program_name)s_%(process_num)02d -redirect_stderr=true -autostart=true -autorestart=true -numprocs=1 -user=www -startsecs=3 -startretries=100000 -``` - -> 也可以添加好后在`子配置文件`中切换并修改，填写上面的配置 - -### 部署管理后台(vue) - -- 克隆代码 - -```bash -git clone https://gitee.com/ShopeX/ECShopX_admin-frontend.git -``` - -- 进入目录 - -```bash -cd /www/wwwroot/demo.ecshopx.com/ECShopX_admin-frontend -``` - -- 检查配置文件 - -```bash -vim .env.production -``` - -- 安装npm包 - -```bash -// 先安装@shopex/finder -npm i @shopex/finder --registry=http://registry.npm.ishopex.cn/ - -// 安装其余依赖 -npm install -``` - -- 项目部署 - -品牌云店模式 -```plain -npm run build:b2c -``` - -多商户入驻平台模式 -```plain -npm run build:bbc -``` - -> 编译好后，代码生成在dist目录下，如下图 - -![](../assets/bt18.png) - -#### 新建API和管理后台站点 - -> 例如说这里新建了一个 `ecshopx.demo.com` 的站点，由于数据库我们前面已经创建过了，这里就不要再重新创建了 - -![](../assets/bt19.png) - -#### 配置API和管理后台Nginx配置 - -这里提前将php、vue的nginx配置配好了，有些目录是下一步才建的，所以这里需要注意，具体配置如下 - -注意：下面配置中如果没有域名，可以改为ip地址 - -```bash -server -{ - listen 80; - server_name ecshopx.demo.com; - - add_header 'Access-Control-Allow-Origin' '*' always; - add_header Access-Control-Allow-Headers "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"; - add_header Access-Control-Expose-Headers "Authorization"; - add_header Access-Control-Allow-Methods "DELETE, GET, HEAD, POST, PUT, OPTIONS, TRACE, PATCH"; - - if ($request_method = OPTIONS ) { - return 200; - } - - location /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; - client_max_body_size 32m; - client_body_buffer_size 256k; - proxy_pass http://127.0.0.1:8081; - } - - location /wechatAuth/ { - proxy_pass http://127.0.0.1:8081; - } - - location /storage/ { - alias /data/httpd/ECShopX/storage/app/public/; - #autoindex on; - } - - location / { - root /www/wwwroot/ecshopx.demo.com/ECShopX_admin-frontend/dist; - index index.html index.htm; - try_files $uri $uri/ /index.html =404; - } - - access_log /www/wwwlogs/ecshopx.demo.com.log; - error_log /www/wwwlogs/ecshopx.demo.com.error.log; -} - -server -{ - listen 8081; - server_name _; - index index.php index.html index.htm; - root /www/wwwroot/ecshopx.demo.com/ECShopX_admin-frontend/public; - - #SSL-START SSL相关配置，请勿删除或修改下一行带注释的404规则 - #error_page 404/404.html; - #SSL-END - - #ERROR-PAGE-START 错误页配置，可以注释、删除或修改 - #error_page 404 /404.html; - #error_page 502 /502.html; - #ERROR-PAGE-END - - #PHP-INFO-START PHP引用配置，可以注释或修改 - include enable-php-74.conf; - #PHP-INFO-END - - #REWRITE-START URL重写规则引用,修改后将导致面板设置的伪静态规则失效 - location / { - try_files $uri $uri/ /index.php$is_args$args; - } - #REWRITE-END - - #禁止访问的文件或目录 - location ~ ^/(\.user.ini|\.htaccess|\.git|\.svn|\.project|LICENSE|README.md) - { - return 404; - } - - #一键申请SSL证书验证目录相关设置 - location ~ \.well-known{ - allow all; - } - - location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ - { - expires 30d; - error_log /dev/null; - access_log /dev/null; - } - - location ~ .*\.(js|css)?$ - { - expires 12h; - error_log /dev/null; - access_log /dev/null; - } - -} -``` - -打开nginx站点修改，点击左侧菜单`配置文件`，将上面的配置复制进去，修改对应的域名和目录位置，如果没有域名，用ip也是可以的，如下图 - -![](../assets/bt20.png) - -### 小程序/H5编译打包（taro） - -#### 编译H5 - -- 检查node版本是否为v16 - -```bash -# 不要完全复制，看看您本地的v16的小版本是哪个，然后就使用哪个版本 -# 本文档编写的时候是v16.16.0 -# 检查版本 -node -v -# 如果版本不是 v16，则执行下面或者去宝塔后台的pm2面板进行修改切换， -# 或者用下面命令行切换，建议去宝塔后台切换node版本 -nvm use v16.16.0 -``` - -- 克隆代码 - -```bash -git clone https://gitee.com/ShopeX/ECShopX_mobile-frontend.git -``` - -- 进入目录 - -```bash -cd /www/wwwroot/ecshopx.demo.com/ECShopX_mobile-frontend -``` - -- 依赖安装 - -```bash -# 如遇初始化下载时间过长或者network timeout，可更换npm镜像源 -# npm更换淘宝镜像，使用此命令后，npm指令关键词改为（cnpm），例如：npm i 改为 cnpm i -# 更换命令：npm install -g cnpm --registry=https://registry.npm.taobao.org - -# 先安装插件 -npm install @shopex/taro-plugin-modules -S --registry=http://registry.npm.ishopex.cn - -# 再安装其他依赖 -npm install -``` - -- 环境变量 - -> 复制一个配置文件 - -```bash -cp .env.example .env -``` - -> 需要申请一个高德地图的key，配置中只需要修改域名的部分 -> -> 注意：小程序需要配置APP_ID，编译H5则可以忽略 - -```json -APP_BASE_URL=http://ecshopx.demo.com/api/h5app/wxapp -APP_WEBSOCKET=wss://ecshopx.demo.com/ws -APP_COMPANY_ID=1 -APP_PLATFORM=platform -APP_CUSTOM_SERVER=http://ecshopx.demo.com/ -APP_HOME_PAGE=/pages/index -APP_TRACK=youshu -APP_YOUSHU_TOKEN= -APP_ID= // 小程序APPID -APP_MAP_KEY= // 高德地图key -APP_MAP_NAME=门店定位 -APP_IMAGE_CDN=https://b-img-cdn.yuanyuanke.cn/ecshopx-vshop - -``` - -- npm打包指令 - -> 执行生产环境H5打包命令`npm run build:h5` -> -> 注意：小程序需要本地执行，在开发者工具进行推送，注意命令差异 - -```bash -# 小程序本地开发编译 -npm run dev:weapp - -# 小程序生产打包 -npm run build:weapp - -# H5本地开发编译 -npm run dev:h5 - -# H5生产打包 -npm run build:h5 -``` - -#### 新建H5站点 - -> 例如说这里新建了一个 `ecshopx-h5.demo.com` 的站点，由于数据库我们前面已经创建过了，这里就不要再重新创建了，php版本选择`纯静态`，根目录选择编译后的h5目录，如下图 -> -> `/www/wwwroot/ecshopx.demo.com/ECShopX_mobile-frontend/dist/h5` - -![](../assets/bt21.png) - -#### 配置H5的Nginx配置 - -```bash -server -{ - listen 80; - server_name ecshopx-h5.demo.com; - index index.php index.html index.htm default.php default.htm default.html; - root /www/wwwroot/ecshopx.demo.com/ECShopX_mobile-frontend/dist/h5; - - #SSL-START SSL相关配置，请勿删除或修改下一行带注释的404规则 - #error_page 404/404.html; - #SSL-END - - #ERROR-PAGE-START 错误页配置，可以注释、删除或修改 - #error_page 404 /404.html; - #error_page 502 /502.html; - #ERROR-PAGE-END - - #PHP-INFO-START PHP引用配置，可以注释或修改 - include enable-php-00.conf; - #PHP-INFO-END - - #REWRITE-START URL重写规则引用,修改后将导致面板设置的伪静态规则失效 - location / { - index index.html index.htm; - try_files $uri $uri/ /index.html =404; - } - #REWRITE-END - - #禁止访问的文件或目录 - location ~ ^/(\.user.ini|\.htaccess|\.git|\.svn|\.project|LICENSE|README.md) - { - return 404; - } - - #一键申请SSL证书验证目录相关设置 - location ~ \.well-known{ - allow all; - } - - location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ - { - expires 30d; - error_log /dev/null; - access_log /dev/null; - } - - location ~ .*\.(js|css)?$ - { - expires 12h; - error_log /dev/null; - access_log /dev/null; - } - access_log /www/wwwlogs/ecshopx-h5.demo.com.log; - error_log /www/wwwlogs/ecshopx-h5.demo.com.error.log; -} -``` - -打开nginx站点修改，点击左侧菜单`配置文件`，将上面的配置复制进去，修改对应的域名和目录位置，如果是纯静态的H5应该直接新建站点选好对应目录就能用了，比php和管理后台的部署要简单的，如下图 - -![测试](../assets/bt22.png) - -#### 注意事项 - -> - 关于小程序预览，dev:weapp本地开发编译模式下因为主包过大无法上传预览，需要使用build:weapp打包后选择小程序开发工具中的详情->本地设置->上传代码时自动压缩混淆。 -> - H5编译文件生成在目录 ECShopX_mobile-frontend/dist/h5/ 下。 -> - 小程序编译文件生成在目录 ECShopX_mobile-frontend/dist/weapp/ 下。 -> - 小程序需要将相关域名配置到小程序的白名单当中 - -```bash -# request合法域名 -https://api域名 -# 下面这行一般配置oss原始域名或者cdn域名 -https://oss-cn-shanghai.aliyuncs.com -https://restapi.amap.com -https://zhls.qq.com - - -# uploadFile合法域名: -https://api域名 -# 下面这行一般配置oss原始域名或者cdn域名 -https://oss-cn-shanghai.aliyuncs.com; - -# downloadFile合法域名 -https://api域名 -# 下面这行一般配置oss原始域名或者cdn域名 -https://oss-cn-shanghai.aliyuncs.com -https://b-img-cdn.yuanyuanke.cn -https://mmbiz.qpic.cn -https://wx.qlogo.cn -https://thirdwx.qlogo.cn -https://wework.qpic.cn -``` -