## 简介
在使用 `Nginx` 时,如果你的 `Vue.js` 应用使用 `history` 模式了 `Vue Router`,`Nginx` 需要进行一些特别的配置,以确保前端路由能正确处理而不会返回404错误。
<!-- more -->
## 配置示例
下面是一个基本的配置示例,假设你的应用已经构建到 `/var/www/html/my-app` 目录:
```nginx
server {
listen 80;
server_name yourdomain.com; # 替换为你的域名或IP
root /var/www/html/my-app; # 替换为你的应用构建目录
index index.html;
location / {
try_files $uri $uri/ /index.html;
}
# 可选:配置日志文件
access_log /var/log/nginx/my-app_access.log;
error_log /var/log/nginx/my-app_error.log;
}
```
### 解释:
- `root /var/www/html/my-app;`:设置你的应用目录。
- `try_files $uri $uri/ /index.html;`:尝试查找请求的文件或目录,如果找不到,则返回 `index.html`。这保证了 `Vue Router` 的 `history` 模式可以正常工作,所有路由请求都会重定向到 index.html,从而由前端路由处理。