uni-app在cli的项目中配置pages.json文件的leftWindow后，在HbuildX中运行到浏览器中时出现vue警告信息跟错误

uni-app在cli的项目中配置pages.json文件的leftWindow后，在HbuildX中运行到浏览器中时出现vue警告信息跟错误

操作步骤：

进入pages.json文件，添加配置

{
    "leftWindow": {  
        "path": "windows/leftWindow",  
        "style": {  
            "width": "240px"  
        }  
    },  
    "topWindow": {  
        "path": "windows/topWindow",  
        "style": {  
            "height": "50px"  
        }  
    }
}

预期结果：

不报错


### 实际结果：

浏览器控制台中出现错误与警告

bug描述：

在https://gitee.com/dcloud/uni-preset-vue/repository/archive/vite-ts.zip中下载的项目中配置pages.json文件中的leftWindow后在HbuildX中运行到浏览器中时出现vue警告信息跟错误


### 附件：
![image](https://www.itying.com/uniimg.php?url=https://img-cdn-tc.dcloud.net.cn/uploads/questions/20240125/dce5ea1a885de89363c4bae9f35df3eb.jpg)

| 信息类别 | 详细信息 |
|---------|----------|
| 产品分类 | uniapp/H5 |
| PC开发环境操作系统 | Windows |
| PC开发环境操作系统版本号 | node:18.16.1, window:11 |
| 浏览器平台 | Chrome |
| 浏览器版本 | 120.0.6099.225（正式版本） （64 位） |
| 项目创建方式 | CLI |
| CLI版本号 | vite下载：https://gitee.com/dcloud/uni-preset-vue/repository/archive/vite-ts.zip |

更多关于uni-app在cli的项目中配置pages.json文件的leftWindow后，在HbuildX中运行到浏览器中时出现vue警告信息跟错误的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app在cli的项目中配置pages.json文件的leftWindow后，在HbuildX中运行到浏览器中时出现vue警告信息跟错误的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在使用 uni-app CLI 项目时，如果你在 pages.json 中配置了 leftWindow，并且在 HBuilderX 中运行到浏览器时出现 Vue 警告信息或错误，可能是由于以下原因导致的：

1. Vue 版本问题

  • 问题描述：HBuilderX 内置的 Vue 版本可能与你的项目依赖的 Vue 版本不一致，导致警告或错误。
  • 解决方案：
    • 确保你的项目依赖的 Vue 版本与 HBuilderX 内置的 Vue 版本一致。可以通过 package.json 文件查看和调整 Vue 版本。
    • 如果你的项目需要特定版本的 Vue，可以在 package.json 中指定，并确保 HBuilderX 使用的是该版本。

2. leftWindow 配置问题

  • 问题描述：leftWindow 是用于配置左侧窗口的选项，可能在某些情况下不被浏览器环境支持，导致错误。

  • 解决方案：

    • 检查 pages.json 中 leftWindow 的配置是否正确，确保所有路径和选项都是有效的。
    • 如果 leftWindow 配置在浏览器环境中无效，可以尝试在 pages.json 中添加条件判断，仅在支持的环境中使用 leftWindow。
    {
  "leftWindow": {
    "path": "pages/leftWindow/index",
    "style": {
      "width": "300px"
    }
  },
  "condition": {
    "current": 0,
    "list": [
      {
        "name": "leftWindow",
        "path": "pages/leftWindow/index",
        "query": ""
      }
    ]
  }
}

3. HBuilderX 插件或扩展问题

  • 问题描述：HBuilderX 的某些插件或扩展可能与你的项目不兼容，导致警告或错误。
  • 解决方案：
    • 尝试禁用或更新 HBuilderX 的插件，确保它们与你的项目兼容。
    • 如果有问题，可以尝试在 HBuilderX 中重新安装或更新相关插件。

4. 项目依赖问题

  • 问题描述：项目的依赖包可能存在冲突或版本不兼容，导致警告或错误。
  • 解决方案：
    • 使用 npm 或 yarn 清理并重新安装项目依赖：
      npm install
      或
      yarn install
回到顶部