怎么运行uniapp

运行 UniApp 的步骤

安装开发环境

确保已安装 Node.js（建议 LTS 版本），通过命令行验证安装：

node -v
npm -v

全局安装 Vue CLI 工具：

npm install -g @vue/cli

创建 UniApp 项目

使用官方模板创建项目：

npx degit dcloudio/uni-preset-vue#vite my-uniapp-project

或通过 HBuilderX（官方 IDE）直接新建项目。

安装依赖

进入项目目录并安装依赖：

cd my-uniapp-project
npm install

运行项目

根据不同平台启动开发服务器：

• 微信小程序：

  npm run dev:mp-weixin

  使用微信开发者工具导入项目下的 dist/dev/mp-weixin 目录。

• H5 网页：

  npm run dev:h5

  浏览器访问 http://localhost:8080。

• App 真机调试（需 HBuilderX）： 通过数据线连接手机，选择「运行到手机或模拟器」。

构建生产版本

生成对应平台的发布包：

npm run build:mp-weixin  # 微信小程序
npm run build:h5         # H5 网页

常见问题处理

• 端口冲突：修改 vite.config.js 中的 server.port。
• 跨域问题：配置代理或后端启用 CORS。
• 小程序路径错误：检查 manifest.json 中的 appid 是否正确。

调试工具推荐

• HBuilderX：官方集成调试工具，支持真机预览。
• Chrome 开发者工具：适用于 H5 页面调试。
• 微信开发者工具：必备小程序调试环境。