documentroot 指向 dist 绝对路径以提供静态文件，但必须配合 mod_rewrite 重写规则——当请求非真实文件或目录时 fallback 至 /index.html，由前端路由接管，否则刷新页面返回 404。
Apache 部署静态网站（比如 Vue、React 打包后的前端项目）时，DocumentRoot 的作用是告诉 Apache：用户访问这个站点时，该从哪个目录里找 HTML、JS、CSS 等文件。但只设好 DocumentRoot 不够——前端路由（如 /user/settings）没有真实对应文件，必须配合重写规则，否则刷新页面就 404。
DocumentRoot 必须指向 dist 目录的绝对路径
打包工具（如 npm run build）生成的静态资源默认在 dist/ 目录下。Apache 不接受相对路径，所以配置中要写完整路径：
-
DocumentRoot /var/www/my-app/dist（Ubuntu/Debian） -
DocumentRoot /srv/www/my-app/dist（RHEL/CentOS） - 确保该目录存在，且 Apache 进程（如 www-data 或 apache）有读取权限
紧跟着配好同路径的 块
仅声明 DocumentRoot 不会自动赋予访问权限。必须用 <directory></directory> 明确允许访问，并启用重写支持：
- 路径需与
DocumentRoot完全一致：<directory></directory> - 关键指令至少包含：
Require all granted（放开访问）、AllowOverride All（允许 .htaccess 生效） - 如果不想依赖 .htaccess，可直接把重写规则写进
<directory></directory>块内
必须启用 mod_rewrite 并配置 fallback 规则
单页应用所有非资源请求（如 /about、/admin）都应返回 index.html，由前端 JS 路由接管。这靠重写实现：
Ainative React Sdk
下载
使用 @ainative/react-sdk 为 React 应用添加 AI 聊天和积分。适用于 (1) 安装 @ainative/react-sdk，(2) 使用 useChat hook 实现聊天完成。
- 先启用模块：
sudo a2enmod rewrite（Debian系）或确认LoadModule rewrite_module modules/mod_rewrite.so已加载（RHEL系） - 在
<directory></directory>内添加标准 fallback 规则：
RewriteEngine On<br>RewriteBase /<br>RewriteRule ^index\.html$ - [L]<br>RewriteCond %{REQUEST_FILENAME} !-f<br>RewriteCond %{REQUEST_FILENAME} !-d<br>RewriteRule . /index.html [L]
含义是：只要请求的不是真实文件（!-f）也不是真实目录（!-d），就统一重写到 /index.html。
验证和重启不能跳过
改完配置后必须检查语法并重载服务，否则修改不生效：
- 检查语法：
sudo apachectl configtest或sudo httpd -t - 无报错后重载：
sudo systemctl reload apache2（Debian）或sudo systemctl reload httpd（RHEL） - 浏览器访问根路径，再手动输入一个前端路由地址（如
/dashboard）并刷新，确认不报 404
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
