管理后台二开编译上线

展开

管理后台二开编译上线

## 说明
管理后台使用vue.js开发，前后端分离，修改以后，需要编译，下面是开发步骤。 
## node环境安装
打开[https://nodejs.org/en/download/releases/](https://nodejs.org/en/download/releases/)，下载Node.js v14.21.3，建议使用与likeshop官方一样的版本，避免编译出现未知错误。根据系统下载对应的版本，windows可以下载msi结尾文件，方便安装。
![](https://md.likeshop.cn/server/index.php?s=/api/attachment/visitFile&sign=c5cef73d7389fb2383517328a204ee35)
 
安装过程中，记得勾上“Automatically……”选项，可以自动配置环境变量。
![](https://md.likeshop.cn/server/index.php?s=/api/attachment/visitFile&sign=c9faf3f1295fefdf125db09ec9690d17) 
打开终端，在终端运行`npm config set registry https://registry.npmmirror.com`，将npm的源设置为淘宝镜像。
![](https://md.likeshop.cn/server/index.php?s=/api/attachment/visitFile&sign=0b1de7e68c134cbabf9131cd65906e8b)

## 管理后台开发模式运行和编译上线
### 安装依赖
/web目录为管理后台的源码目录，在终端使用cd命令进入，运行`npm install`安装依赖。
![](https://md.likeshop.cn/server/index.php?s=/api/attachment/visitFile&sign=c0512a0b6544f86154067f3991703814)
![](https://md.likeshop.cn/server/index.php?s=/api/attachment/visitFile&sign=9397c9be08168521d2fe5f090ef42fc5) 
### 运行
打开/web/src/config.ts文件，修改变量host_development的值为部署好的项目域名，在/web目录运行`npm run serve`,运行项目。访问终端返回地址，即可访问项目。这是我们可以对代码进行二次开发。
![](https://md.likeshop.cn/server/index.php?s=/api/attachment/visitFile&sign=9a387db7c907b1877b69099ffadf4ca1) 
![](https://md.likeshop.cn/server/index.php?s=/api/attachment/visitFile&sign=e29d0d268a79a526ae5bd39884a86934) 
### 编译上线
二次开发完以后，我们需要对代码进行编译。在/web目录，运行`npm run build`编译源码。
![](https://md.likeshop.cn/server/index.php?s=/api/attachment/visitFile&sign=cbc4d710b3862987c8fee7d08f2a67f3) 
编译成功后，生成/web/dist目录，将目录命名成admin后，替换掉服务器中/server/pbulic/admin目录。重新打开上线管理后台页面，刷新即可。
![](https://md.likeshop.cn/server/index.php?s=/api/attachment/visitFile&sign=58ec694d66e2507d4927d972df1bb9d9)