uni-app从创建到运行到微信开发者工具
uni-app是一个基于Vue.js开发跨平台应用的前端框架
解决了原生小程序编写的繁琐，只要你会vue就可以通过uni-app编写小程序
首先开发工具我推荐HBuilder，虽然我比较喜欢VScode，但这个真的很适合写uni-app,而且uni-app官方推荐使用HBuilderX来开发uni-app类型的项目
好处：模板丰富、有完善的代码提示、可以一键运行到多个平台来预览我们的项目
也可以使用VScode等自己熟悉的编辑器
下载HBuilderX
地址：https://www.dcloud.io/hbuilderx.html
选择下载正式版》App开发版
解压（纯英文目录） 双击HBuilderX.exe即可启动
在HBuilderX中安装scss/sass编译插件
方便编写css样式<style lang="scss"></style>
地址：https://ext.dcloud.net.cn/plugin?name=compile-node-sass
登录，没有账号先注册，
登录成功后，先打开一下HBuilderX，点击绿色的使用HBuilderX导入插件
点击确定跳转到HBuilderX
点击安装，等待安装成功即可
文件》新建》项目
项目名字、路径、推荐选择uni-ui项目、vue版本的选择
创建即可
登录自己的小程序微信公众平台，复制粘贴自己的微信小程序的AppID
在HBuilderX配置微信小程序（粘贴自己的AppID）如图：
HBuilderX中配置微信开发者工具的安装路径
首先要下载微信开发者工具然后：
工具》设置》如图
在微信开发者工具中，设置》安全设置》开启服务端口：如图
运行
首先关闭微信开发者工具
在HBuilderX中
运行》运行到小程序模拟器》选择第一个默认微信开发者工具
点击后则会自动将项目运行到微信开发者工具中
如图
运行后会自动打开微信开发者工具，并将运行的项目运行起来
如果运行后出现白屏问题，关闭微信开发者工具，在HBuilderX中停止运行项目，然后再重新运行一遍
吼吼吼，完事儿啦！！！
uni-app从创建到运行到微信开发者工具相关推荐
- hbuilder运行uniapp,微信开发者工具打开但没有运行项目
问题描述 最近接手公司uniapp项目,使用Hbuilder运行uniapp,微信开发者工具打开但没有运行项目: 原因分析: 检查微信小程序开发工具是否最新版; 微信开发者工具登录的微信号,可能未绑定 ...
- 【工作小tip】uni-app无法运行到微信开发者工具、三层渐变色、小程序bug：ReferenceError: regeneratorRuntime is not defined
uni-app无法运行到微信开发者工具 需要配置微信开发者工具,打开服务端口 微信小程序==>设置==>安全==> 开启接口 如果还不行 就去manifest.json文件去掉微信小 ...
- 如何用HBuilderX把uni-app项目运行到微信开发者工具上
1.复制自己的微信小程序的AppID: 方法一:在微信开发者工具中获取APPID 方法二: 在小程序后台获取 2.在HBuilderX 新建项目中填写自己的微信小程序的 AppID: 3.在 HBui ...
- 将uniapp项目运行到微信开发者工具上
这里以Hbuilder X为例 1.填写自己的微信小程序的AppID: 2.在Hbuilder x中 ,配置微信开发者工具的安装目录 3.在微信开发者工具中通过设置->安全设置,开启服务端口 4 ...
- uni-app创建小程序项目并运行到微信开发者工具上@令狐张豪
在这直接说步骤 1. 创建uni-app小程序项目 2. 打开项目中的manifest.json文件进行配置 2.1 写入微信小程序AppID 2.2 打开HBuilder X 工具-设置 填写外部w ...
- 一分钟解决HbuilderX运行到微信开发者工具时报错提示：fail to open IDE
打开创建的文件中的manifest.json文件,可以用vscode打开 配置自己的appid之后再重启HbuilderX就可以自动导入了
- HbuliderX项目运行至微信开发者工具详细教程
- 【小程序专栏】第一个uniapp项目编译到微信开发者工具以及android真机运行
在本专栏之前的文章已经为大家介绍过,uniapp作为一个跨端开发框架被广泛应用.通过uniapp可以开发一套程序.运行到andoid.ios以及各种小程序端,微信小程序.支付宝小程序.百度小程序.字节 ...
- uniapp写微信小程序怎么运行到微信开发工具上
1.选择运行>运行到小程序模拟器>运行到微信开发者工具 2.这样unpackage中就多一个文件mp-weixin 3.把这个文件导入到微信小程序中就行啦
最新文章
- error code [17027]; 流已被关闭;
- 刀片服务器与机架服务器对比
- 信令风暴研究现状总结
- 「mysql优化专题」这大概是一篇最好的mysql优化入门文章（1）
- 逻辑函数代数法化简（二）
- 使用C#的Winform实现图文识别OCR及截图功能
- 模块参考资料-硬件资料-Air720UG/UH
- VMWare安装报错：此安装程序要求您重新启动系统以完成 Microsoft VC Redistributable安装，然后重新运行该安装程序。
- github rust 项目Travis ci配置
- 第十六届“振兴杯”计算机网络管理员赛项理论参考题库(1)单选
- PHP套件的实验结果分析,PHP环境搭建套件评比测 | Wopus
- 基于Acgis从全球.nc数据中提取中国地图并计算地区CO2值
- social-GAN
- 【Qt OpenGL教程】14：轮廓字体
- expdp/impdp时大量等待Streams AQ: Enqueue Blocked On Low Memory
- UE的rtsp插件崩溃过程排查
- python爬虫入门实战！爬取博客文章标题和链接！
- 海思3536 nand 扩容操作教程
- 66666666666
- 二维分岔混沌matlab,一类三维动力系统的分岔及混沌分析