diff --git a/README.md b/README.md index 0c9975b..6642d7f 100644 --- a/README.md +++ b/README.md @@ -16,7 +16,11 @@ npm run dev npm run build ``` -### 对于Nginx服务器需要添加以下配置: +## 部署配置 + +本项目使用 Vue Router 的 History 模式,部署时需要配置服务器将所有非静态文件的请求回退到 `index.html`,否则直接访问子路由(如 `/help`)会返回 404。 + +### Nginx 找到你站点 Nginx 配置文件(通常在 `/etc/nginx/conf.d/xxx.conf` 或 `/etc/nginx/sites-available/xxx`),在 `location /` 块中添加 `try_files`: @@ -39,20 +43,12 @@ server { } ``` -**核心就是这一行:** - -```nginx -try_files $uri $uri/ /index.html; -``` - -它的含义是: +核心配置 `try_files $uri $uri/ /index.html;` 的含义: 1. 先尝试查找请求的文件(`$uri`) 2. 再尝试查找请求的目录(`$uri/`) 3. 都找不到就返回 `index.html`,让 Vue Router 接管路由 -## 生效步骤 - -修改完配置后,执行: +修改完配置后,执行以下命令使其生效: ```bash # 检查配置语法是否正确 @@ -62,4 +58,42 @@ nginx -t nginx -s reload ``` -配置生效后,直接访问 `/help` 就不会再 404 了。 +### Apache + +在构建产物 `dist` 目录下创建 `.htaccess` 文件,内容如下: + +```apache + + RewriteEngine On + RewriteBase / + + # 如果请求的是真实存在的文件或目录,直接访问 + RewriteCond %{REQUEST_FILENAME} !-f + RewriteCond %{REQUEST_FILENAME} !-d + + # 否则全部转发到 index.html + RewriteRule . /index.html [L] + +``` + +注意事项: + +1. 确保 `mod_rewrite` 模块已启用: + ```bash + sudo a2enmod rewrite + sudo systemctl restart apache2 + ``` + +2. 确保站点配置中允许 `.htaccess` 覆盖配置: + ```apache + + Options Indexes FollowSymLinks + AllowOverride All + Require all granted + + ``` + +3. 修改完后重启 Apache: + ```bash + sudo systemctl restart apache2 + ```