• 下面来介绍下自己的针对小程序和微信开发者工具的使用心得。 下载地址:开发者工具下载地址 1.下载并安装以后打开,微信号扫码登录登录开发者工具。 如果还没有注册,可以填写无AppID,它会显示部分功能受限,...

    微信开发者工作是微信官方提供的针对微信小程序的开发工具,集中了开发,调试,预览,上传等功能。下面来介绍下自己的针对小程序和微信开发者工具的使用心得。

    下载地址:开发者工具下载地址

    1.下载并安装以后打开,需使用微信号扫码登录开发者工具

    登陆新建一个quick start项目


    如果还没有注册,可以填写无AppID,它会显示部分功能受限,实际上并没有太大影响。

    2.添加一个quick start项目


    3.目录结构

    从上图的右侧可以很清晰地看出来一个微信小程序的结构,一个微信小程序的页面包括四个文件:

    a.“.js”后缀的是脚本文件,主要是写一些业务逻辑的代码,基本和JavaScript一样。(在开发过程中发现一些函数JS有而微信没有,毕竟这是微信自己的一套东西)。

    b.“.json”后缀的是配置文件,例如tab的各种属性,实际中每个小页面的使用的并不多,涉及全局配置的app.json使用比较多,app.json中包括定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。

    c.“.wxml”后缀的是前端显示页面文件,你也可以把它理解为html页面,规则也和html5很类似,还是那句话,并不是完全一样,有些H5实现的东西wxml并不能实现。

    d.“wxss”后缀的是样式表文件,类似于css。

    以上是每个微信小程序页面的四种基本构成,微信开发者工具会根据这些,编译生成相应的小程序实例。


    展开全文
  • 微信开发者工具调试微信网页授权,点击‘登录’按钮无效 问题描述 h5页面需要获取微信用户信息,参考微信开发者文档: 新的改变 我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,...

    微信开发者工具调试微信网页授权,点击‘登录’按钮无效

    问题描述

    h5页面需要获取微信用户信息,参考 微信开发者文档,一步步走到用开发者工具调试页面,却发现点击登录按钮没有反应!如下
    微信授权页面
    看日志信息
    在这里插入图片描述
    好吧,说这个图片路径是http,而应该是https,可是这是微信自己的页面啊,怎么改???
    然鹅不是这个原因,偶然发现点击按钮上边缘是有效的,点击之后重定向页面,跟文档描述的一模一样。为什么点击上边缘有效,而点击按钮无效?如果你也是这样,那么请打开电脑设置—字体大小–看看是不是125%???
    现在,把字体设置成100%,重新打开微信开发者工具,再去调试上面的页面,你会惊喜地发现,点按钮可以了。

    原因

    电脑设置的字体大小(非100%)的时候,会影响微信开发者工具dom节点事件绑定的位置,根据表现来看,并不影响渲染。

    补充一下

    过程中call_me_small_pure的博客 给了很大帮助,感谢!

    展开全文
  • 我的情况是将在webStorm上开发的代码复制到微信开发者工具上时,经简单修改后不报错了但是界面黑屏, 找了一段时间发现是图片资源的路径没有设置正确。如下: 这是在微信开发者工具上的情况: 其实在webStrom上...

    我的情况是将在webStorm上开发的代码复制到微信开发者工具上时,经简单修改后不报错了但是界面黑屏,

    找了一段时间发现是图片资源的路径没有设置正确。如下:

    这是在微信开发者工具上的情况:

    其实在webStrom上的路径是:

    ['rock','../res/Rock.png'],

    这也是我们在做比如java开发时路径写法,../表示回到上一级目录,在webStorm上没有问题,但是在微信开发者工具上却不能有../

    展开全文
  • 微信开发者工具(一) 一、微信开发者工具基本信息 1.1 微信开发者工具的下载 ​ 直接打开下面网址进行下载: ​ https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html 1.2 下载以后登录 1.3 ...

    微信开发者工具(一)

    一、微信开发者工具基本信息

    1.1 微信开发者工具的下载

    直接打开下面网址进行下载:

    https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

    1.2 下载以后登录

    登录微信开发者工具.png

    1.3 新建项目

    1.4 微信开发者工具详情页

    [外链图片转存失败(img-gmV5PArB-1567256776341)(https://i.loli.net/2019/08/30/yvtRNblSdWjp4K5.png)]

    1. 模拟器:

      • 可以调整对应的机型

      • 可以调整展示页面的大小

      • 模拟网络状态:WIFI、2G、3G、4G和Offline(断网)

      • 模拟操作

        模拟操作.png

    该操作的模拟前后端,前后端的切换操作,

    例如当用户从小程序中回到聊天窗口,会触发一个小程序被设置为后台的回调。

    1. 调试工具:

      • **Wxml:**帮助开发者开发,wxml转发后的界面。可以看到真实的页面结构,和结构对应的wxss属性,同时可以通过更改wxss属性,实时的看到修改的情况

      • Sources panel: 用于显示当前的脚本文件,在Sources panel的脚本是已经编译好的脚本,已经处理之后的脚本文件。在Sources panel运行的时候,运行到断点,会导致整个小程序停止运行。

      • AppData panel: 用于展示目前运行小程序时的具体数据

      • Storage panel: 可以直接对数据进行删除、新增和修改
        用于显示当前项目使用的wx.setStorage或者wx.setStorageSync后的数据储存情况

      • Network Panel: 用于观察和显示 request 和 socket 的请求情况

      • **Console panel:**两大功能:

        1. 开发者可以在此输入和调试代码
        2. 可以再次查看小程序的报错

        在控制台可以输入命令

        build:编辑小程序

        Preview: 预览

        upload:上传代码

        openVendor:打卡基础库所在目录

        openToolsLog:打开工具日志目录

        checkproxy(url):检查指定url的代理使用情况

      • Sensor panel:
        两个功能:

        1. 开发者可以在这里选择模拟地理位置
        2. 开发者可以在这里模拟移动设备表现,用于调试重力感应API

        重力测试.gif

    展开全文
  • 这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、...

    就是把防火墙关掉
    在这里插入图片描述
    请把防火墙关闭 然后打开微信开发者工具就会显示文件了。我的就是这样解决的。
    好了后 你可以在吧防火墙开启 也可以使用一个专有网络关闭防火墙。反正如果没有文件显示你就去关闭防火墙再打开就可以了。

    展开全文
  • 微信开发者工具在咱们开发微信小程序和微信公众号时会使用上,之前遇到一个问题就是在微信的授权页面点击不生效,其实不是点击不生效,是点击的位置偏移,最后找到问题所在是因为win10有缩放大小的问题(按照下面的...
  • 后面在调试的过程中,真机连上一段时间没有管它,这段时间过程中,微信开发者工具会自动断开与真机的连接的。 当再次打算重新扫面真机调试二维码时,就出现了: 已结束,请重新开始的状况 (当时没有及时截图,该图...
  • 微信开发者工具无法使用本地E:\*************** 这种地址, 如果需要本地测试的话, 可以使用laya开启的服务 可以使用这个相对的地址本地调试 ...
  • 如果想用微信提供的远程仓库而没有开通代码管理的话可以一键去开通,开通后新建一个仓库即项目(这时候会提示你: 如果想要拉取和提交项目,先设置密码,按提示操作就可以了 )也可以新建项目组后再新建项目 ...
  • 即刻下载使用==》微信web开发者工具下载 2、调试微信网页授权,具体操作步骤为: 1)开发者可以在调试器中点击“登录”,使用手机微信扫码登录,从而使用真实的用户身份来开发和调试微信网页授权。请确认手机登录页...
  • 鼠标点击红色箭头指向的...
  • 小程序开发助手中,同一个开发者只能显示一个开发版本 测试同事找开发要二维码,效率较低 本地生成的二维码会出现携带本地代码、未及时拉取分支其他改动等问题 为了避免如上问题的发生,采用微信小程序集成 Jenkins...
  • 微信开发者工具中 实现微信小程序之相机拍照功能的开发 包括相机拍照文件相册的打开 镜头的反转等
  • 问题:1、从打开开发者工具就一直弹出当前系统代理不是安全代理是否信任,随意点确定或取消或点右上角 X 关闭都可以正常打开工具使用,在使用过程中仍继续不间断弹框当前系统代理不是安全代理是否信任 尝试1:在...
  • 第八节 在微信开发者工具和手机上测试 虽然游戏能在Cocos Creator引擎的模拟器上正常运行,但这不代表移植到小程序上运行时不会有问题。为确保游戏上线后正常运行,我们必须要在微信开发者工具和手机上都进行测试...
  • error:unable to verify the first certificate
  • win7操作系统,具体操作为终止taskhost.exe进程即可。方法很多比如:360加速球–网速–终止taskhost.exe进程。或者开始-注销 也可。
  • 上周微信开发者工具一直没有办法打开页面,本来打算写一篇关于小程序的文章,结果等了半天试了好几次都是这样的界面,临近下班就没有在意了,今天来打开电脑还是如此,怎么也打不开编辑界面。到最后,使用了一个奇葩...
  • 微信小程序开发者工具的使用:登录自己的微信小程序页面,找到工具,下载微信开发者工具。下载好后,扫码登录自己的小程序。在登录的过程中,需要输入自己的小程序的appid。登录好之后就会显示这样的一个页面。目录...
  • 自己创建的mpvue项目,玩了几天,不知道自己操作了什么,用微信开发者打开项目直接报错了。。 郁闷了很久,开发者工具路径打开dist目录又可以,刚接触mpvue一时也找不到原因 。。。 最后弄了好久,每个...
1 2 3 4 5 ... 20
收藏数 12,740
精华内容 5,096