likeadmin编译后404

编译后出现 404 错误通常是由于前端路由配置与服务器设置不匹配导致的。以下是常见原因和解决方案：

1. 检查路由模式

• 问题：Vue/React 等 SPA 应用默认使用 history 模式，但生产服务器未配置 URL 重写。
• 解决：
  • 方案 A：将路由模式改为 hash 模式（如 Vue Router 的 mode: 'hash'），重新编译部署。
  • 方案 B：保持 history 模式，在服务器配置中将所有请求重定向到 index.html。

2. 配置服务器重写规则
根据你的服务器类型进行配置：

• Nginx：

  复制代码

  location / {
      try_files $uri $uri/ /index.html;
  }
  

• Apache：

  复制代码

  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
  

• Tomcat：在 web.xml 中添加：

  复制代码

  <error-page>
      <error-code>404</error-code>
      <location>/index.html</location>
  </error-page>
  

3. 检查静态资源路径

• 确认 vue.config.js（Vue）或 package.json（React）中的 publicPath 是否正确（例如设为 './' 或对应子目录路径）。
• 确保编译后的文件已正确上传到服务器目标目录。

4. 验证部署目录结构

• 编译后的 dist 文件夹应直接包含 index.html 和静态资源（如 js、css 文件夹）。
• 如果部署到子路径（如 domain.com/admin），需同步调整路由 base 和资源路径。

5. 清除缓存

• 清理浏览器缓存或尝试无痕模式访问。
• 检查服务器是否启用了缓存（如 CDN），必要时刷新缓存。

快速排查步骤：

1. 直接访问 http://your-domain.com/index.html，若正常则确认是路由问题。
2. 检查浏览器开发者工具（Network 标签）的请求状态和路径。
3. 对比本地运行与线上环境的配置差异。

如需继续排查，请点击下方【🔍追问按钮】提交补充信息