uni-app 4.07版本H5项目无法在电脑打开

信息类别	详情
产品分类	uniapp/App
PC开发环境	Windows
PC系统版本	window11
HBuilderX	正式
HBuilderX版本	4.07
手机系统	Android
手机系统版本	Android 14
手机厂商	华为
手机机型	1
页面类型	vue
vue版本	vue2
打包方式	云端
项目创建方式	HBuilderX

示例代码:

3.99版本 可以直接在谷歌浏览器打开h5项目
更新到4.7版本 点击下面的路径进入 然后报: 
找不到 127.0.0.1 的网页找不到与以下网址对应的网页：http://127.0.0.1:5173/
HTTP ERROR 404

操作步骤:

预期结果:

实际结果:

bug描述:

yibo5220 1楼•7 天前

使用 @dcloudio/uvm 升级下

itying888 2楼•7 天前

npx @dcloudio/uvm@latest 可以了谢谢老哥

yibo5220 3楼•7 天前

在 uni-app 4.07 版本中，H5 项目无法在电脑上打开，可能是由于多种原因导致的。以下是一些常见的排查步骤和解决方案：

1. 检查项目配置

确保 manifest.json 文件中的 H5 配置正确：

{
  "h5": {
    "router": {
      "mode": "history"
    }
  }
}

router.mode：如果设置为 "hash"，确保 URL 中包含 #；如果设置为 "history"，确保服务器支持 history 模式的路由。

2. 检查端口占用

H5 项目默认运行在 localhost:8080 或其他端口。如果端口被占用，可能导致无法访问。

使用以下命令查看端口占用情况：
```
netstat -ano | findstr :8080
```
如果端口被占用，可以修改 H5 项目的运行端口：
```
npm run dev -- --port 8081
```

3. 检查跨域问题

如果项目需要访问后端接口，确保后端服务已开启并支持跨域请求。

在 manifest.json 中配置代理：

{
  "h5": {
    "devServer": {
      "proxy": {
        "/api": {
          "target": "http://your-api-server",
          "changeOrigin": true
        }
      }
    }
  }
}

4. 检查运行命令

确保使用的是正确的运行命令：

npm run dev:h5

或者：

yarn dev:h5

5. 检查浏览器缓存

尝试清除浏览器缓存或使用无痕模式访问。

6. 检查项目依赖

确保项目依赖正确安装：

npm install

或者：

yarn install

7. 查看控制台日志

打开浏览器的开发者工具（F12），查看控制台是否有错误日志，根据错误信息进行排查。

8. 升级 uni-app 版本

如果问题仍未解决，建议尝试升级到最新版本的 uni-app：

npm install -g [@vue](/user/vue)/cli
npm install -g [@dcloudio](/user/dcloudio)/uni-cli