uni-app:微信小程序从HBuilderX下载到编译运行项目

简介: uni-app:微信小程序从HBuilderX下载到编译运行项目

一、环境配置


1、微信小程序工具下载

2、HBuilderX工具下载

3、小程序下载到本地


二、工具配置


1、导入小程序项目

打开HBuilderX,导入项目,如下图:

1693cf0afdd4494581fae06f2a636ec7.png

2、设置运行配置

打开HBuilderX的偏好设置:

aa1d94cbfb244061af0396bb20c6dd4d.png

设置需要运行的配置地址:

0771e9a21fd84632a4494d90a7b2d171.png


3、微信开发者工具配置

打开服务端口开关,如下图:

74647ff7eda44c829be986562f80a495.png


4、企业微信小程序模拟器配置

0a8446a8bcc849a7992d55d2fe93dee6.png


5、小程序账号配置

需要在小程序开发者后台添加配置,见下图(看不了后台,盗个图):

5877ea7bd8e84e6fb83ada715646cb22.png


三、运行处理


1、运行项目

8ffb4a3a89e44b32a60093fbbd574b28.png


2、错误处理

2.1、插件没有安装提示

这里忘记截图,直接抄一张:

8fd5a10061884f85b8b4e543e32e3ed4.png

参考解决方案:uni-app 预编译器错误


2.2、小程序端口没有配置报错

[error] 工具的服务端口已关闭。要使用命令行调用工具,请在下方输入 y 以确认开启,或手动打开工具 -> 设置 -> 安全设置,将服务端口开启。


处理方法,见【二、3】。


2.3、不校验合法域名设置

为方便调试,需要添加

49e73c88aefe47c3bcf5b283fa3eeb79.png


最后展示下运行成功的结果:

b5b8d207e46b4610b756eb90119a8d9b.png

相关文章
|
2月前
|
XML Java 数据库
安卓项目:app注册/登录界面设计
本文介绍了如何设计一个Android应用的注册/登录界面,包括布局文件的创建、登录和注册逻辑的实现,以及运行效果的展示。
173 0
安卓项目:app注册/登录界面设计
|
2月前
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
292 3
|
2月前
|
XML 小程序 JavaScript
小程序入门之项目配置说明和数据绑定
小程序入门之项目配置说明和数据绑定
42 1
|
2月前
|
缓存 开发框架 移动开发
uni-app:下载使用uni&创建项目&和小程序链接&数据缓存&小程序打包 (一)
uni-app 是一个跨平台的开发框架,它允许开发者使用 Vue.js 来构建应用程序,并能够同时发布到多个平台,如微信小程序、支付宝小程序、H5、App(通过DCloud的打包服务)等。uni-app 的目标是通过统一的代码库,简化多平台开发过程,提高开发效率。 在这一部分中,我们将逐步介绍如何下载和使用uni-app、创建一个新的项目、如何将项目链接到小程序,以及实现数据缓存的基本方法。
|
2月前
|
JavaScript
vue尚品汇商城项目-day06【43.微信支付业务】
vue尚品汇商城项目-day06【43.微信支付业务】
35 0
|
2月前
|
小程序 API
微信小程序更新提醒uniapp
在小程序开发中,版本更新至关重要。本方案利用 `uni-app` 的 `uni.getUpdateManager()` API 在启动时检测版本更新,提示用户并提供立即更新选项,自动下载更新内容,并在更新完成后重启小程序以应用新版本。适用于微信小程序,确保用户始终使用最新版本。以下是实现步骤: ### 实现步骤 1. **创建更新方法**:在 `App.vue` 中创建 `updateApp` 方法用于检查小程序是否有新版本。 2. **测试**:添加编译模式并选择成功状态进行模拟测试。
53 0
微信小程序更新提醒uniapp
|
4月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
114 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
4月前
|
小程序 前端开发 JavaScript
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序
【避坑宝】是一款企业黑红名单吐槽小程序,旨在帮助打工人群体辨别企业优劣。该平台采用SpringBoot+MybatisPlus+uniapp+uview2等技术栈构建,具备丰富的注释与简洁的代码结构,非常适合实战练习与学习。通过小程序搜索“避坑宝”即可体验。
112 0
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序
|
4月前
|
存储 小程序 JavaScript
|
5月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的汉服交易小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的汉服交易小程序的详细设计和实现(源码+lw+部署文档+讲解等)
67 7