首先登陆微信公布的简易教程网页，登陆上去后，点击导航栏上方的“工具”按钮。然后点击左侧边的导航栏“下载”按钮。 微信小程序开发工具有windows 64,windows 32和mac版本，根据自己的电脑情况，下载适合自己的版本。 把微信小程序开发工具下载回

本篇经验将和大家介绍利用利用微信web开发者工具开发第一个程序，希望对大家的工作和学习有所帮助！

方法

打开已经安装的微信web开发者工具，如下图所示：

跟风体验了下微信小程序的开发流程，发现官方的微信 web 开发者工具并不支持在代码中打断点。 用了一阵子 console.log 之后觉得好麻烦，突然想起还有一招： debugger; debugger 语句可以在 Chrome 和 Firefox 下打断点，微信 web 开发者工具应该

使用微信扫描二维码登录“微信web开发者工具”，点击“确认登录”，如下图所示：

常见的有 sublime webstorm 其实工具都大同小异，会熟练使用一个就可以了

选择“本地小程序项目”，如下图所示：

准备工具 微信公众号、微信个人号； 电脑； 使用步骤 微信web开发者工具下载，并安装。 启动微信web开发者工具。 登录微信公众号，进入web开发者工具，绑定个人微信号。 通过个人微信号，登录微信web开发者工具。 从微信公众号复制链接到地址栏

点击“添加项目”，如下图所示：

为了帮助开发者简单和高效地开发和调试微信小程序，在原有的公众号网页调试工具的基础上，推出了全新的 微信开发者工具，集成了公众号网页调试和小程序调试两种开发模式。 使用公众号网页调试，开发者可以调试微信网页授权和微信JS-SDK 详情 使

添加项目对话框中，选择“无AppID”，填写项目名称和项目目录，然后点击“添加项目”，如下图所示：

使用工具： 电脑； web开发工具； 例子：以安卓的移动调试为范本； 调试步骤： 选择无线网卡地址，默认即可，工具会自动查询无线网卡ip v4地址。 设置 - 无线局域网 - 选中网络 - HTTP代理手动，设置好上面步骤以后，重启微信，这可能是让微信重

创建的项目主界面和项目的目录结构如下图所示：

微信手机端调试工具下载地址 这里写图片描述 注：1.如果安装调试工具-微信Web开发者工具需要卸载以前安装过的微信Web开发者工具（比如小程序-微信Web开发者工具），建议使用腾讯管家之类的清理干净。 2.安装好后，选择移动调试，X5 Blink内核调

点击左侧的“编辑”即可预览项目效果，关于更多开发知识，请参考微信公众平台上的技术文档，如下图所示：

有个曲线救国的方式 微信web开发者工具有beta版，这个不会覆盖正式版，可以共存，也就达到了双开目的。 beta版下载地址 https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/beta.html

扩展阅读，以下内容您可能还感兴趣。

微信web开发者工具 ios怎么使用

微信web开发者工具主要功能：

　　使用自己的微信号来调试微信网页授权；

　　调试、检验页面的 JS-SDK 相关功能与权限，模拟大部分 SDK 的输入和输出；

　　使用基于 weinre 的移动调试功能；

　　利用集成的 Chrome DevTools 协助开发。

　工具顶部菜单栏是刷新、后退、选中地址栏等动作的统一入口，以及微信客户端版本的模拟设置页。左侧是微信的 webview 模拟器，可以直接操作网

页，模拟用户真实行为。右侧上方是地址栏，用于输入待调试的页面链接，以及清除缓存按钮。右侧下方是相关的请求和返回结果，以及调试界面和登录按钮。本回答被提问者采纳

微信web开发者工具用什么登录

用微信登录，你可以到微信公众平台上找到小程序注册入口，（注意，一定要在这个入口注册账号，如果你在公众平台注册公众号的话就不行了。）注册的时候需要你个微信扫描二维码，这个微信就是管理小程序的管理账号，并且用它登录小程序开发工具。

微信web开发者工具是用什么写的

微信Web开发工具有很多，包括比如说Liveweave、JS Bin、Codepen、Dabblet等等。但是，Web开发人员没必要全部精通，找到适合自己使用的就可以了，然后学到真正的开发技术，成为互联网大型企业都在高薪招聘的web开发人才。

第一种微信Web开发工具——Liveweave

它还有一个吸引我眼球的地方，就是它的协作功能。如果你过去曾经使用过Teamviewer，你会发现它们是相似的。你需要做的事只是点击协作链接，你就可以分享来自于你到weave的链接了。

第二种微信Web开发工具——JS Bin

JS Bin和以前开发平台的区别在于它允许你把文件下载到你的电脑上，这对于开发者，尤其是在离线状态下调试代码的程序员来说，是一个很不错的特点。你还可以创建私人的Bin空间，不过你需要对此付费。另外，JS Bin不支持协作功能。

第三种微信Web开发工具——Codepen

Codepen用于CSS的预处理器包括SCSS、SASS，LESS和Stylus，用于JS的有CoffeeScript和LiveScript，用于HTML的包括Haml、Markdown、Slim和Jade。

第四种微信Web开发工具——Dabblet

现在，Dabblet最棒的地方在于它允许用户以5个不同的视角进行预览，分别是CSS编辑器和效果，HTML编辑器和效果，CSS和HTML的编辑器和效果，JavaScript及运行结果，全部综合效果。这些功能在绝大部分的开发环境中都没有。

第五种微信Web开发工具——JSFiddle

如果你在与其他开发者合作，我强烈建议你使用JSFiddle。在所有的开发环境中，JSFiddle的协作特性是同类型应用中最好的，而且区别于Codepen的是，它的这个特性是操作简单并且免费的。

第六种微信Web开发工具—— CSSDeck C

SSDeck虽然很简洁，但它有一个让我很吃惊的特性，就是它支持用户改变字体大小，这是一个简单却实用的功能。所以说，如果你在寻找有很多很炫的功能的开发平台，CSSDeck可能不适合你。它的简洁性让你更专注于最重要的事情，这也是它最大的特点。本回答被提问者采纳

小白怎么开发者工具开发微信小程序语言

1、首先要下载微信官方的微信Web开发者工具。打开微信公众平台，找到右下方的小程序模块，点击「开发」按钮

2、点击顶部导航栏的「工具」按钮，在新页面的左侧栏中找到「下载」。可以看到，开发工具提供 Windows 32 位、Windows 64 位和 Mac 三个版本。可根据实际情况，选择适合自己电脑的开发工具。

3、安装后，就可以直接启动开发者工具。如果是首次启动开发者工具，需要使用开发者的微信号扫码登录。登陆后，点击「添加项目」按钮，填写 AppID(如果没有，则点击无 AppID)和项目名称。接着，在项目目录中点击「选择」，新建一个文件夹作为新的项目目录。然后再次点击「添加项目」，就可以新建出一个微信小程序项目了本回答被提问者采纳

微信web开发者工具 普通调试怎么打开

方法/步骤

微信web开发者工具下载，并安装

下载链接：

启动微信web开发者工具

登录微信公众号，进入web开发者工具，绑定个人微信号

通过个人微信号，登录微信web开发者工具

从微信公众号复制链接到地址栏，大功告成

移动调试，敬请关注。