• 一、微信小程序web开发工具下载地址 1.1 在微信公众平台-小程序里边去下载开发工具下载地址。 1.2 下载后安装一下就可以使用了: 二、创建项目 2.1 微信小程序web开发工具...

    一、微信小程序web开发工具下载地址


    1.1 在微信公众平台-小程序里边去下载开发工具下载地址


    1.2 下载后安装一下就可以使用了:


    二、创建项目


    2.1 微信小程序web开发工具需要扫码登陆,所以必须先绑定开发者才可以:



    2.2 已经绑定的开发者可以创建项目,需要填写AppID、项目名称、本地开发目录。





    AppID需要去设置里边获取,如果不填的话官方给的提示是部分功能受限:




    三、开发工具界面介绍:





    1. 编辑:开发的时候,需要到编辑区去写代码 

    2. 调试:开发完需要调试程序的时候需要切换到这个区域,调试区有很多工具可供使用。

    3. 项目:在这里可以上传或者预览项目

    4. 编译:就相当于运行项目的意思

    5. 关闭:关闭当前工程

    6. 微信小程序web开发工具提供实时预览的功能,界面的效果会在这个区域显示

    7. 这个区域可以看到整个项目的文档目录结构

    8. 这个区域是编码区

    9. 这里是选择屏幕尺寸的地方

    10. 模拟网络环境:2G/3G/4G/WiFi



    四、调试区六大工具介绍:


    在调试区开发工具提供了6种调试模式:


    4.1 Console

    Console的意思是控制台,做过开发的都知道几乎每个IDE都会有控制台,可以显示错误信息和打印变量的信息等。


     

    4.2 Sources

    Sources显示了当前项目的所有脚本文件,微信小程序框架会对这些脚本文件进行编译。

    Source下边还有一个区域,做过软件开发的都知道,一般下边是控制台会显示一些log信息、断电调试等等。



    4.3 Network

    Network顾名思义:这个区域显示的是与网络相关的信息,我这里暂时没有进行网络请求。



    4.4 Storage

    官方的解释是显示当前项目的使用wx.setStorage或者wx.setStorageSync后的数据存储情况。这个后续用到再慢慢研究


     

    4.5 AppData

    AppData是显示当前项目显示的具体数据,可以在这里编译,并且会在页面实时显示。



    4.6 Wxml


    Wxml调试区:把他的名字换一下的话大家就好理解了,其实他的实质就是HTML+CSS,微信只是把HTML改成了Wxml而已。学过HTML的人一看就明白,左侧的区域是HTML语言+CSS的一些标签属性。右侧可以便捷的设置CSS的属性。




    转自:http://lib.csdn.NET/article/5/52864?knId=1796#focustext

    展开全文
  • 微信开发者工具中 实现微信小程序之相机拍照功能的开发 包括相机拍照文件相册的打开 镜头的反转等
  • 第八节 在微信开发者工具和手机上测试 虽然游戏能在Cocos Creator引擎的模拟器上正常运行,但这不代表移植到小程序上运行时不会有问题。为确保游戏上线后正常运行,我们必须要在微信开发者工具和手机上都进行测试...
  • 2.在开发者工具中打开dist目录,而不是整个目录, 在开发者工具中就可以预览weui组件的示例了。   如果想在自己项目中引用weui组件,需要如下步骤: 1. 打开weui-wxss-master目录 --> dist目录 --&...
  • 2.打开微信开发者工具的版本管理 3.打开左侧栏的“设置”,选择“远程” 4.选择“网络和认证”,选择“使用用户名和密码” 5.选择“抓取”,会得到远程的各分支 fetch和git的区别 : 获取最新版本 有两种 拉取 ...
  • Linux微信开发者工具安装 2017-09-25 09:08:27
    Linux微信开发者工具安装
  • 微信Web开发者工具只有window版本和mac版本,如果想要在Linux系统下运行微信Web开发者工具,需要花费很大周折。 1、下载nwjs 下载nwjs的SDK。 2、将微信web开发者工具拷贝到nwjs 将在window系统下安装的微信web...
  • 这次的微信web开发者工具的更新主要是对开发工具的功能增强和bug修复,增加修改了一些最近一直频繁在开发者中被提出的问题,比如请求的地址不是合法的域名地址之类的问题。 具体看下面吧: 开发者工具基础功能 1....
  • 本文为大家介绍一下微信小程序开发者工具版本管理的一些使用方法,结合了笔者的一些使用体验和官方使用文档,致力于方便大家理解使用该项功能。本文编写时笔者使用的开发者工具版本为Stable v1.02.1910120.使用本...
  • 微信Web开发者工具只有window版本和mac版本,如果想要在Linux系统下运行微信Web开发者工具,需要花费很大周折。本文和大家分享的就是linux系统下运行微信web开发者工具相关内容,一起来看看吧。  注:带 * 的...
  • 微信开发工具使用git 2018-11-16 17:09:29
    1、初始化本地仓库 在微信Web开发者工具中点击「版本管理」。... 这一步骤相当于执行「git init」命令。 ...2、初始化完成后,我们可以...下图为微信Web开发者工具初始化后的版本控制面板。 3、配置仓库信息 初...
  • 2.打开微信开发者工具的版本管理 3.打开左侧栏的“设置”,选择“远程” 4.选择“网络和认证”,选择“使用用户名和密码” 5.选择“抓取”,会得到远程的各分支 fetch和git的区别 : 获取最新版本 有两种 拉取 ...
  • 做这个小程序项目起始都一直在用git命令行进行git版本管理,后来从后台同学那里安装了小乌龟,用了几天,起始发现和之前webstorm自带的VCS里面集成的git命令菜单差不多,都是将git命令行的操作方式转成了快捷菜单和...
  • 微信Web开发者工具只有window版本和mac版本,如果想要在Linux系统下运行微信Web开发者工具,需要花费很大周折。 注:带 * 的步骤或文件为不确定是否管用的步骤或文件。本人系统为Linux Mint 18.1版本。 ...
  • 微信开发者工具除了自带的git版本管理(本地服务)之外,还可以推送到在线git仓库中去,这样别人也可以通过git来拉取你的代码片段或小程序。 一、1.登录git 一、2.点击创建项目 一、3.填写项目信息,点击...
  • 微信小程序云开发数据库接口文档地址:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/database.html 近期做微信小程序时发现腾讯在...第一步,打开微信开发者工具中的云开发,创建云开发资源 ...
  • 使用vscode开发微信小程序 2020-02-11 19:51:15
    提高微信小程序的开发效率 前言: 近期开始学习微信小程序,用了自带的开发者工具,泪目~ ...微信开发者工具出现莫名的卡顿,经常重启让人十分懊恼 等等等~~~~~~ 原始的界面工具 所以在这像各位安利一款编辑...
  • 微信小程序 git版本管理 2019-02-12 16:31:09
    本文主要介绍微信小程序的git版本管理,实现小程序代码的维护。 注册自己账号以及密码 1.访问网址,扫描登录。https://git.weixin.qq.com/users/authorize#wechat_redirect 2.登录成功后,点击头像>个人...
  • 使用小程序的git代码管理的前提是你的电脑上是带有Git的环境,这样可以直接使用,否则的话需要先装Git,微信开发者工具中的Git只是简化了使用Git的过程。 1.打开版本管理 2.第一次使用的话,需要先初始化Git仓库 ...
  • 微信小程序开发者工具安装和创建小程序 (地图定位代码) 地图定位案例:最后附带小程序地图定位代码 小程序简介 小程序特点 体验好(编译包不超过1M) “无须安装,即用即走”的特性让微信小程序拥有着近乎原生App...
1 2 3 4 5 ... 20
收藏数 6,894
精华内容 2,757