HBuilderX和uni-app的关系：框架、工具与项目创建

uni-app是跨端应用开发框架，HBuilderX是为它做了强化的开发工具。用HBuilderX创建uni-app项目很方便，但两者不是同一个产品：前者决定项目如何组织、编译和面向不同平台运行，后者提供创建、编辑、调试与发行入口。

HBuilderX负责开发体验，uni-app负责项目能力

uni-app项目使用Vue风格的页面、组件和配置来描述应用，并根据目标平台完成编译。HBuilderX是通用前端开发工具，对uni-app提供了项目模板、语法支持和运行菜单。可视化创建方式内置了相关环境，新手不用先手动配置Node.js。

项目代码并没有“锁在HBuilderX里”。页面、样式、静态资源和业务逻辑都是工程文件，团队协作时仍应使用版本控制保存。需要留意的是项目采用的创建方式和项目内的编译依赖。

创建方式不同，编译器所在位置也不同

通过HBuilderX可视化界面创建的项目，相关编译器由HBuilderX安装目录的插件提供，升级HBuilderX时会随之更新。标准版在运行或发行uni-app时可能提示安装对应插件，安装完成后才能使用相关能力。

CLI创建的项目把编译器安装在项目目录中，版本由项目依赖管理。它可以像普通npm工程一样在支持d.ts的编辑器中开发。将已有CLI工程整体拖入HBuilderX后，编译仍会使用项目下的编译器。同一套代码在不同环境中表现出版本差异，可以检查这里。

哪些任务更适合使用HBuilderX

• 快速创建项目、直接运行到浏览器或设备、查看uni-app专用配置，使用集成入口会少走一些步骤。
• 用模板创建空项目并运行到目标端，页面更新说明基础工程已经正常工作。
• App云端打包需要使用HBuilderX。H5和各类小程序发布可以使用其他开发工具。

习惯其他编辑器不必重建项目。检查package.json、编译器版本和类型提示后，可在副本中跑通页面与原有构建命令。App发布或HBuilderX专属菜单操作再回到HBuilderX完成。

排查问题时区分工具与项目

菜单缺失、插件未安装或工具无法识别项目，属于开发工具环境问题。页面语法、依赖引用、平台接口和构建报错，应回到项目配置与代码排查。

• 记录运行目标、创建方式和完整报错，方便定位问题发生在哪个环节。
• 使用新建模板对照测试，可避免把编辑器问题误判成uni-app框架不支持。