# 前端配置

  1. 这里将为你介绍如何配置部署发布A3Mall,如果你在配置过程中遇到问题,请先看这个文档!
  2. 为了节约大家的时间,文档里面有提及的问题在群里均不做任何回复。请一定仔细阅读这个文档!

# 前期准备

  1. php开发环境,可以使用集成安装包比如xampp、MAMP、宝塔等集成环境。
  2. 对于运行环境要求
PHP >= 7.2.0
MySQL >= 5.6
PDO PHP Extension
MBstring PHP Extension
fileinfo PHP Extension
  1. 在编辑器选择上建议使用VS Code或者ide,请勿使用记事本来修改代码。
  2. 本次演示安装在Mac下进行,在windows下也是基本差不多的

# 安装软件

  1. 下载nodejs 下载

下载nodejs LTS版本

图片alt

  1. 安装nodejs 图片alt 图片alt 图片alt 图片alt

等待安装完成即可

  1. 安装完成后打开终端,在windows打开cmd
输入:npm --version

图片alt

  • 如图所示安装成功

# 打包前端

  • 进入己下载好的h5文件夹
  • 在终端或者cmd里输入:cd 路径/h5 图片alt
  • 如果h5目录下有node_modules目录,请先删除
  • 在终端或者cmd里输入:npm install 图片alt
  • 下载依赖完成

图片alt

  • 修改配置文件
# 找到h5根目录下的.env.production配置文件
# 修改 VUE_APP_WEB_NAME,VUE_APP_WEB_API_URL

# VUE_APP_WEB_WECHAT_LOGIN 商业基础版新增v1.5.7 高级版在 v.1.2.6 新增加
# 用于开启微信端用户自动登录功能 1:开启,0:关闭

VUE_APP_WEB_WECHAT_LOGIN=1
如下图所示

图片alt

  • 修改完成后保存

  • 在修改以下文件

vue.config.js       =>chainWebpack方法   // 旧版本需要修改
.env.production     =>标题和URL
// src/views/public/login.vue
登录页               =>标题和副标题
// src/views/home/home.vue
首页                 =>顶部标题
  • 打包前端并且替换前端页面内容
# 如果在打包时报:gyp verb check python checking for Python executable "python" in the PATH
# 请执行以下命令:
# 执行此命令需要管理员权限,在windows下 cmd 右键管理员执行 
npm install --global windows-build-tools --save

# 打包前端页面成功后,先删除程序目录A3Mall/public目录下的index.html static/wap 
# 然后将H5/dist目录的内容复制到A3Mall/public目录下。 
# 执行打包命令
npm run build

# 程序部署

在phpStudy上安装A3Mall商城系统:http://www.a3-mall.com/forum/view/4.html
在宝塔上部署A3Mall商城系统:http://www.a3-mall.com/forum/view/3.html
在MAMP下安装A3Mall商城系统:http://www.a3-mall.com/forum/view/1.html

# 其他帮助

# 在执行npm install 下载依赖包时可能会很慢,可以使用国内的源来下载
# 国外镜像慢的解决方法:
# get命令查看registry
npm congfig get registry

# 原镜像下载地址 http://registry.npmjs.org
# 使用set命令换成阿里的镜像
npm config set registry https://registry.npm.taobao.org
npm install

# 也可以直接运行命令:
npm install --registry=https://registry.npm.taobao.org