单域名部署 Vue.js 和 ThinkPHP6 实践指南
本指南详细介绍如何在同一个域名下成功部署 Vue.js 前端应用和 ThinkPHP6 后端框架。
前端配置 (Vue.js)
使用 history 模式时，需要修改 vue.config.js 文件，指定正确的公共路径：
立即学习“PHP免费学习笔记（深入）”；
module.exports = {
publicPath: '/subdirectory/' // 将 subdirectory 替换为你的子目录名
};前端部署
将 Vue.js 应用构建后的 dist 文件夹放置到 ThinkPHP6 项目的 public 目录下的 subdirectory 子目录中（与 vue.config.js 中的配置保持一致）。
后端路由 (ThinkPHP6)
感谢广大歌迷长期以来对网站的支持和帮助，很多朋友曾经问我要过这个商城程序，当时由于工作比较忙，一直没空整理，现在好啦，已全部整理好了，在这里提供给有需要的朋友，没有任何功能限制，完全可以使用的，只是有些商品的广告需自己修改一下，后台没有办法修改，需要有HTML基础才可以修改，另外，哪位朋友在使用的时候，发现了BUG请与我们联系，大家共同改进，谢谢！后台管理地址：http://你的域名/admin/
0
ThinkPHP6 需要配置路由，确保所有非 API 请求都转发到 Vue.js 应用。 这可以通过在路由文件中添加规则来实现，例如，将所有未匹配的请求重定向到 /subdirectory/index.html。 具体实现方法取决于你的路由配置方式。
伪静态规则 (Nginx 或 Apache)
为了实现根域名访问，你需要配置伪静态规则。以下是一个 Nginx 的示例：
location / {
try_files $uri $uri/ /subdirectory/index.html;
}Apache 的示例：
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /subdirectory/index.html [L]端口和 HTTPS 配置
为了通过 houxinqian.cn 直接访问网站，你需要：
houxinqian.cn 指向你的服务器 IP 地址。通过以上步骤，你就能在一个域名下成功部署 Vue.js 和 ThinkPHP6 应用，实现前后端分离的架构。 请根据你的具体环境和配置进行调整。
以上就是如何在一个域名下部署Vue和ThinkPHP6？的详细内容，更多请关注php中文网其它相关文章！
PHP怎么学习？PHP怎么入门？PHP在哪学？PHP怎么学才快？不用担心，这里为大家提供了PHP速学教程(入门到精通)，有需要的小伙伴保存下载就能学习啦！
广告
收藏
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
198
