微信小程序开发调试器（小程序 调试）
今天给各位分享微信小程序开发调试器的知识，其中也会对小程序 调试进行解释，如果能碰巧解决你现在面临的问题，别忘了关注本站，现在开始吧！
本文目录一览：
微信小程序的开发工具有哪些
为了帮助开发者简单和高效地开发和调试微信小程序，在原有的公众号网页调试工具的基础上，推出了全新的 微信开发者工具，集成了公众号网页调试和小程序调试两种开发模式。
使用公众号网页调试，开发者可以调试微信网页授权和微信JS-SDK 详情
使用小程序调试，开发者可以完成小程序的 API 和页面的开发调试、代码查看和编辑、小程序预览和发布等功能。
为了更好的开发体验，从视觉、交互、性能等方面对开发者工具进行升级，推出了 1.0.0 版本。
如何使用微信web开发者工具调试程序
微信web开发者工具使用教程：
1、首先用户需要做的就是先下载安装，并启工具。
即刻下载使用==》微信web开发者工具下载
2、调试微信网页授权，具体操作步骤为：
1）开发者可以在调试器中点击“登录”，使用手机微信扫码登录，从而使用真实的用户身份来开发和调试微信网页授权。请确认手机登录页，绑定的公众号为“微信 web 开发者工具”。
2）为了保证开发者身份信息的安全，对于希望调试的公众号，我们要求开发者微信号与之建立绑定关系。具体操作为：公众号登录管理后台，启用开发者中心，在开发者工具——web 开发者工具页面，向开发者微信号发送绑定邀请。
3）开发者在手机微信上接受邀请，即可完成绑定。每个公众号最多可同时绑定10个开发者微信号。邀请确认页面如下图所示：
4）完成登录和绑定后，开发者就可以开始调试微信网页授权了，注意只能调试自己绑定过的公众号：
非静默授权的 URL：点击查看
在微信 web 开发者工具中上面的 URL，webview 模拟器显示效果如图：
点击“确认登录”即可带着用户信息跳转到第三方页面，很方便的进行后续的开发和调试。
静默授权的 URL：点击查看
在微信 web 开发者工具中打开该 URL 则会自动跳转到第三方页面。
（注意：如果使用了代理，需代理本身支持https直连，才能调试https页面。）
3、模拟JSSDK权限校验
通过 web 开发者工具，可以模拟 JSSDK 在微信客户端中的请求，并直观地看到鉴权结果和 log。以微信 JSSDK DEMO 页面为例：
微信小程序需要哪些开发工具
微信小程序需要哪些开发工具?
一、微信小程序官方开发工具
注意，它只是个工具，而不是一个IDE。官方工具中的代码编辑功能，就是将vscode的代码编辑功能嵌入到工具中，不足以支撑开发。
优点
因为是官方工具所以有这其它第三方工具有这不可比拟的天然优势，如果不是他代码编辑功能太弱的话。
官方工具，可调试，可预览
基本的代码编辑、智能提示、调试等功能都有
项目管理、创建、手机预览、代码提交审核
官方维护更新
缺点
不好的地方也很明显，总体而言是一款工具而不是IDE。糟糕的代码编辑功能，写起代码非常别扭，这是我放弃它的最重要原因。
api提示不全，要一个个查api，影响写代码的速度
很多必备的快捷键都没有，比如全选关键字、快速复制一行等等
颜色主题不能选，不喜欢白色风格怎么搞
没有插件 没有插件 没有插件 重要的事情说三遍
评价
目前因为需要用到微信web开发工具进行小程序的创建、调试、查看、预览、上传，所以这个工具必不可少。但是代码编辑功能实在太差，推荐使用其它第三方代码编辑工具代替。
二、即速应用——适合技术小白的小程序开发工具
严格来说，即速应用并不是为专业程序员准备的开发工具，但它绝对是一款功能非常强大的微信小程序制作工具。不懂技术不懂编程的人，一定会爱上即速应用这款工具的。
优点
可视化操作，直接拖拽组件生成页面
提供大量可套用的模板
可将代码打包下载，直接对接到小程序的开发工具
下载下来后的代码可以任意编辑
缺点
电商模板居多，其他类别的模板较少
复杂的功能仍然需要专业程序员二次开发
评价
客观地说，即速应用这款微信小程序制作工具非常适合技术小白。因为它相当于把需要代码的`部分都帮你做好了，所以不用太头疼技术方面的问题。当然，如果你是程序员，一样可以在它生成的代码基础上进行二次开发的。
三、Sublime Text 3——简洁高效的开发工具
sublime text 3定位于代码编辑器而不是IDE，在代码提示方面只能算一般般，不过胜在使用起来非常方便。
优点
打开文件速度倍儿快、UI简洁大方
代码编辑体验舒适、高效
拥有大量插件，针对不同需求基本上能找到对应插件来满足
第三方开发者开发小程序插件用于代码着色和代码提示
缺点
没有调试，没有预览
因为是第三方开发者编写的插件，代码提示也不是非常全面
评价
使用门槛不会太高，可以迅速上手。是但如果想实现一些丰富的功能就会比较吃力了。
四、WebStorm——功能繁多的重度开发工具
WebStorm网上有个插件，可以实现代码提示，不能做调试和预览，并且属于重度工具，如果你是，可以尝试一下这个工具。
优点
有插件可以实现代码高亮，代码提示等功能
有非常成熟和非常丰富的功能
各种快捷键
缺点
无法调试预览
功能比较多、比较臃肿
评价
Webstorm和上述几个工具相比，代码编辑功能较强大。但是需要插件支持才可以开发小程序，而且体积臃肿。
微信开发者工具中调试器旁边显示的是什么
微信开发者工具区域构成
调试器区域各个面板的功能
Wxml面板：用于帮助开发者开发 Wxml 转化后的界面。在这里可以看到真实的页面结构以及结构对应的 wxss 属性，还可以查看数据是否渲染到页面的代码上。同时可以通过修改对应的代码，在模拟器中实时看到修改的情况（仅为实时预览，无法保存文件）。通过调试器区域左上角的选择器，还可以快速找到页面中组件对应的 wxml 代码。
Console面板：可以用来显示小程序的输出信息、出错信息等，还可以在控制台中输入build（编译小程序）、preview（预览）、upload（上传代码）、npm（包管理）等命令，执行URL的代理使用情况的checkProxy（URL）命令。
AppData面板：用于显示当前项目运行时小程序 AppData 具体数据，实时地反映项目数据情况，可以在此处编辑数据，并及时地反馈到界面上。
Sources面板：用于显示当前项目的脚本文件，与浏览器开发不同，微信小程序框架会对脚本文件进行编译，所以在 Sources 面板中开发者看到的文件是经过处理之后的脚本文件，开发者的代码都会被包裹在 define() 函数中，并且对于 Page（页面） 代码，在尾部会有 require 的主动调用。
Storage面板：用于显示当前项目的使用 wx.setStorage() 或者 wx.setStorageSync() 后的数据存储情况。可以直接在Storage面板上对数据进行删除、新增、修改。
NetWork面板：用于观察发送请求（request）和调用文件（socket）的信息和具体情况。
Audits面板：可用来在小程序运行过程中实时检查，分析出一些可能导致体验不好的地方，并定位出哪里有问题，以及给出一些优化建议。
Security面板：用于调试当前程序的安全和认证等问题，并确保已经在程序上正确使用Https。
Sensor面板：可以在这里选择模拟地理位置（纬度、经度、速度、精确度、高度、水平、精确度、垂直精确度等地理定位信息和方向定位信息）；模拟移动设备表现，用于调试重力感应API。
Trace面板：实现对不同设备的监测
关于微信小程序开发调试器和小程序 调试的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。
