代码结构
打开开发者工具，可以看到小程序项目和公众号网页项目两个选项，我们选择小程序项目，填写完项目目录、APPID、项目名称就进入开发工具主页了。
-
代码结构与基本配置
app.js 帮助我们注册一个微信小程序应用 app.json 帮助我们进行微信小程序的全局配置，包括网络请求的超时时间、窗口的路径、各个页面的注册路径 app.wxss 帮助我们设置微信小程序的一个全局的样式 project.config.json 由开发者工具帮我们在根目录下生成，保存微信开发者工具的配置信息，方便大家进行自己的一些个性化设置 pages 文件夹，里面存放的是微信小程序里所有的页面，便于管理。每个小程序页面最多由四个文件组成js文件(帮我们处理微信小程序页面的逻辑和一些数据交互)、json文件(微信小程序页面的配置信息)、wxml文件(帮我们展示微信小程序页面的一些元素和内容)、wxss文件(帮我们设置微信小程序页面元素的样式) utils 一般存放的是一些工具的函数，达到代码复用的目的 -
配置文件介绍（包括app.json全局配置文件和页面配置文件）
app.json可以配置项 Pages：注册我们微信小程序的所有页面 tabBar：小程序如果是多tab的页面，通过tabBar的配置项来制定我们tab栏的表现 networkTimeout:设置各个网络请求的一个超时时间 debug:开启debug模式在开发者工具的控制台打印我们需要的信息 navigationStyle:导航栏的样式 page页面的json可以配置项 disableScroll:设置页面是否开启滚动 两者都可以配置的项 navigationBarBackgroundColor:设置导航栏的背景色 navigationBarTextStyle:设置导航栏的文字样式 navigationBarTitleText:设置导航栏的标题文字 backgroundColor:设置窗体的背景颜色 backgroundTextStyle:设置窗体下拉时的一个文字样式 onReachBottomDistance: enablePullDownRefresh:设置微信小程序或单个页面下拉刷新时的一个表现 如果小程序的全局配置和单个页面的window的一些配置项重复了，那么页面的配置项会覆盖全局配置项。-
开发工具的内容
页面左侧包括模拟器、编辑器、调试器编译:我们可以自己设置自己需要的一些编译场景
预览功能:可以让本地代码在真机上预览
远程调试功能:通过网络连接让我们手机运行的小程序进行一个调试
切后台:帮我们快速切到不同的场景值
清缓存:可以清除开发者工具和设备的一些文件缓存，数据缓存，网络缓存等
上传：帮助我们把本地代码上传到管理后台，然后默认设置为我们的一个开发版本（小程序的版本包括预览、开发、体验、审核、线上五个版本，）
测试功能：微信给我们随机分配4-8中机型，测试小程序页面的首屏加载时间，CPU占比等
腾讯云：帮助我们构建一个小程序的开发和线上环境
调试器：包括console控制台打印模块、sources模块会列出我们小程序页面所有脚本文件、network面板展示各个网络请求的状态信息以及请求资源的一个响应数据等、storage面板是当我们在小程序里调用wx.setStorege和wx.setStorageSync这个函数设置我们的缓存的时候，我们在这里可以动态的修改这些缓存数据、AppData是小程序页面上真实展示的一个数据、wxml面板展示了小程序页面的各个组件元素，并且可以对元素进行一个样式的修改、sensor面板是我们的一个地理位置信息和设备旋转角度的展示
-
网友评论