tp6+vue-elementui-admin实现前后端权限分离框架

这次用的是hardphp/tp6-vue-admin

有时候不正常，直接下载

服务端：

git clone https://github.com/hardphp/tp6-vue-admin.git
composer install
1
2

• 安装redis，PHP中开启redis
  https://blog.csdn.net/xzzhfei/article/details/120064022
  或是在宝塔面板中为PHP添加redis扩展

• 建库，导入tp666.sql

• 配置config/database.php，写入正确的库名、用户和密码以及表格前缀 “tp_"，否则出10501错误

• php think run，或建立站点运行

• 后台帐号是admini 123456

• 如果部署到宝塔面板，还要设置一下运行目录为public

前端：

node.js版本要用14，16是不行的，与sass loader有冲突

npm install
或
yarn install(尽量用这个）
1
2
3

开发模式：

配置vue.config.js，
proxy配置为tp地址，如http://127.0.0.1:8000 或 http://xxx.com

proxy: {      
      [process.env.VUE_APP_BASE_API]: {
        target: `http://xxxx.cn`,
        changeOrigin: true,
        pathRewrite: {
          ['^' + process.env.VUE_APP_BASE_API]: ''
        }
      }
1
2
3
4
5
6
7
8

.env.development中的VUE_APP_BASE_API 设置空

npm run serve
1

生产模式：

• .env.production 正式环境 编译时配置接口地址如http://127.0.0.1:8000/index.php
• 如果静态动态分离，可能要进行反向代理，没再深究
• 可以把动静合一为一个网站，把前端build以后，把编译后的backend目录复制到tp/public/中，访问/backend即可，.env.production 中的VUE_APP_BASE_API = ''即可

代码修改

现在系统不提供增删改功能，需要改\app\traits\ControllerTrait.php，把方法的第一行return json_error(10005)注释掉

添加页面

• 在views下建立文件夹mypages
• 在mypages下建立page1.vue，并设计页面内容，配合的JS，调用的API
• 在后台，权限列表中按照别的栏目模式添加一级和二级菜单

---

• 编译