最简单的Vue与Tp5共存

作者: 注水猪肉 | 来源:发表于2019-02-27 16:33 被阅读0次

1、【原理：】vue和tp5有自己的路由，但是tp5用来做数据端就不需要这个了，直接设置为vue的nginx配置即可，如下图

image.png

2、NGINX设置

location / {
  try_files $uri $uri/ /index.html;
}
location ~ ^/(thinkphp|vendor/phpunit|application|runtime)/.*\.php
{
    return 404;
}

image.png

tp5的运行目录在根目录下的public,将vue打包的文件上传这个目录，然后解压在public就行

3、最后一步
就是api接口问题，要怎么访问?

正常的api接口是：

/api/index/add

现在改动后变成：

/index.php/index/add

最简单的Vue与Tp5共存
1、【原理：】vue和tp5有自己的路由，但是tp5用来做数据端就不需要这个了，直接设置为vue的nginx配置即...
[Vuejs 学习笔记] 一. 模板与数据双向绑定
官方文档最简单的 Vue 框架用法, 在 HTML 中集成 Vue
ThinkPHP5小程序笔记（二）
TP5数据库惰性连接，节省资源；TP5中使用查询构造器不使用原生sql的好处是，TP5编写了一套规范，语法简单的...
nginx
vue 项目，共存 location /xxxx/ {alias /tmp/xxxxindex index.htm...
VUE系列教程目录
VUE系列教程目录 vue入门之路篇系列教程： vue最简单的入门教程+实战+Vue2+VueRouter2+we...
VUE系列教程目录
VUE系列教程目录 vue入门之路篇系列教程：vue最简单的入门教程+实战+Vue2+VueRouter2+web...
人生迷途
磨难与惊喜，共存！人与兽，也能共存
Vue学习笔记
0.参考文档理解vuex -- vue的状态管理模式 vuex最简单、最详细的入门文档 vue+webpack项...
vue最简单的入门教程+实战+Vue2+VueRouter2+w
推荐我的vue教程：VUE系列教程目录通过前两个文章： vue最简单的入门教程+实战+Vue2+VueRoute...
vuex入门详解
vuex最简单、最详细的入门文档 vuex最简单、最详细的入门文档如果你在使用 vue.js , 那么我想你可能...