使用HbuilderX运行uniapp中小程序项目

  1. 下载HbuilderX,下载链接: HBuilderX-高效极客技巧 
  2. 导入相关项目。
    使用HbuilderX运行uniapp中小程序项目_第1张图片
  3. 下载微信开发者工具。
  4. 使用微信开发者工具打开:
    使用HbuilderX运行uniapp中小程序项目_第2张图片
    注意:如果是第一次使用,需要先配置小程序ide的相关路径,才能运行成功。如下图,需在输入框输入微信开发者工具的安装路径。
  5. 设置微信开发者工具的开发端口号,点击设置 -> 安全设置;
    使用HbuilderX运行uniapp中小程序项目_第3张图片
    将服务端口打开:
    使用HbuilderX运行uniapp中小程序项目_第4张图片
  6. 在HbuilderX中下载Vue2,或者Vue3的插件,不然会出现编译失败。
    使用HbuilderX运行uniapp中小程序项目_第5张图片
    使用HbuilderX运行uniapp中小程序项目_第6张图片
  7. 在HbuilderX中点击运行到小程序。
    使用HbuilderX运行uniapp中小程序项目_第7张图片
  8. 可以看到成功运行到微信开发者工具。
    使用HbuilderX运行uniapp中小程序项目_第8张图片

你可能感兴趣的:(uni-app)