应使用 rewritecond %{the_request} /index.html [nc] 配合 rewriterule ^(.*?)index.html$ /$1 [r=301,l] 实现 301 跳转，使 example.com/index.html 强制重定向为 example.com/，确保浏览器地址栏真正去除后缀，而非仅内部重写。
Apache环境下用.htaccess重写index.html为根路径
直接访问 example.com/index.html 时想变成 example.com/，本质是让服务器把根路径请求自动映射到 index.html 文件，而不是靠用户手动输后缀。Apache 默认已启用 DirectoryIndex，但若你发现访问域名后仍显示 /index.html 在地址栏，说明重写或跳转没生效，不是文件没找到。
常见错误现象：403 Forbidden（.htaccess 权限未开）、500 Internal Server Error（正则写错或 RewriteEngine 没开启）、跳转后 URL 又带上了 /index.html（规则顺序不对）。
- 确保 Apache 启用了
mod_rewrite，且站点配置中允许 .htaccess 覆盖：AllowOverride All - 在网站根目录放
.htaccess，内容如下：
RewriteEngine On
RewriteCond %{THE_REQUEST} /index\.html [NC]
RewriteRule ^(.*?)index\.html$ /$1 [R=301,L]
DirectoryIndex index.html
注意第二行 %{THE_REQUEST} 是关键：它匹配原始 HTTP 请求行（如 GET /index.html HTTP/1.1），避免循环重写；第三行用 R=301 强制外部跳转，让浏览器地址栏真正“去掉”后缀。不要只写内部重写（去掉 R=301），否则 URL 不变，伪静态就失效了。
Nginx里用try_files和return实现无后缀访问
Nginx 没有 .htaccess，必须改服务器配置。目标不是“隐藏”，而是让所有对 / 的请求都返回 index.html 内容，且不暴露路径。如果只是 try_files /index.html =404，那对 /about 这类前端路由也有效，但本例聚焦根路径。
典型错误：用 rewrite ^/$ /index.html break; —— 这只是内部重写，浏览器地址栏仍是 /，看似满足，但一旦用户手输 /index.html，它依然能访问，没真正“禁掉”后缀。
- 正确做法是加一条显式跳转规则，拦截含
index.html的请求：
location = /index.html {
return 301 /;
}
location / {
try_files $uri $uri/ /index.html;
}
location = /index.html 是精确匹配，优先级高于通配，确保任何直接访问 /index.html 都 301 跳回 /；而 try_files 保证根路径请求能正常加载文件。注意 return 301 /; 结尾的斜杠不能省，否则可能跳成 //。
Vue/React单页应用里history模式与index.html的关系
如果你用 Vue CLI 或 Create React App，并启用了 HTML5 History 模式（即路由不带 #），那么服务端必须配合——否则刷新 /user/123 会 404，因为真实路径下没有该文件。这时 index.html 不仅是首页，更是所有前端路由的 fallback 入口。
容易被忽略的点：光靠前端路由配置不够，服务端仍要确保 /user/123 这种路径最终也返回 index.html 内容，而不是报错。也就是说，“去掉 index.html 后缀”在这里其实是两个任务：一是根路径美化，二是全量前端路由兜底。
- 开发时
vue-cli-service serve自带 fallback，不用管 - 部署到 Nginx 时，上面的
try_files $uri $uri/ /index.html;就同时解决了根路径和子路由问题 - 但别误以为加了这条就自动“隐藏了所有 index.html”——它只对不存在的路径生效；对明确请求
/index.html的 URL，还得靠前面的location = /index.html单独处理
GitHub Pages、Vercel等托管平台怎么处理
它们不让你改服务器配置，所以没法用 rewrite 或 location 规则。GitHub Pages 默认把 index.html 当首页，访问根路径就是它，但如果你手输 /index.html，它依然响应且不跳转——这是平台限制，无法绕过。
Vercel 更友好：在项目根目录加 vercel.json，用重写规则强制跳转：
{
"rewrites": [
{ "source": "/index.html", "destination": "/" }
]
}
Netlify 同理，在 _redirects 文件里写：/index.html / 301。但注意：这些只是跳转，不是“删除后缀”的技术动作；真正的隐藏依赖服务端是否响应根路径且不暴露物理文件名——而这部分由平台隐式完成，你只需确保入口文件叫 index.html 即可。
最常被漏掉的一环：本地测试时用双击打开 index.html（file:// 协议），此时所有相对路径和 history.pushState 都会失败，根本跑不起来。必须用本地 server（如 npx serve）测，否则你以为“去掉了后缀”，其实只是浏览器缓存或巧合。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
