打开小程序开发者工具，在调试控制台输入openVendor就会打开小程序的WeappVendor目录，该目录包括以下几个主要内容：
wcc可执行程序，用于将wxml内容转换为js内容，执行方式：wcc xxx.wxml
wcsc可执行程序，用于将wxss内容转换为视图可使用css内容，执行方式 wcsc xxx.wxss
不同版本小程序基础库x.x.x.wxvpkg, 里面包含小程序基础库WAService和WAWebview
1、wxml使用wcc转换正如上面分析的，通过调用小程序内置的可执行程序执行wcc xxx.wxml，将指定的wxml转换为js脚本内容。其具体用法可以--help查看，如下图：
小程序开发者工具底层会将小程序项目中所有wxml转为js内容，可以理解为为每个页面wxml进行了注册。例如我们小程序demo有两个页面index.wxml和logs.wxml，其中index.wxml内容如下图：
通过wcc可执行程序生成的相关页面注册的代码如下图所示：
从页面转换的js内容来看，主要记录标签的属性及其值等。另外，转化的js脚本提供最核心的方法是$gwx方法，可以在开发者工具开发控制台访问到，其方法签名如下：
$gwx = function(path, global) { ... return function(env,dd,global){ ... } }该方法根据传入具体的页面wxml路径，找到对应的页面，然后返回一个函数，向该函数传入页面渲染需要的数据（即Page中data对象）就能得到该页面wxml对应的js对象形式表示的dom树。其实每个小程序页面在页面准备初始化渲染时会调用这个$gwx方法，调用如下图所示：
另外，我们直接在开发者工具的控制台直接调用，输入如下语句，可以得到的js对象表示如下图：
$gwx('./pages/index/index.wxml')({show: true})；wcsc可执行程序用于处理wxss，小程序底层使用该可执行程序转换为js内容来处理页面css的引用。首先我们来看下wxss提供功能，如下图：
小程序底层使用wcsc -db -pc来转换对应wxss文件的，其生成的js内容如下图eval函数中的字符串所示：
生成是js主要作用：
添加尺寸单位rpx转换，可根据屏幕宽度自适应
提供setCssToHead方法将转换后的css内容添加到header
开发者工具主入口小程序开发者工具的主入口也是小程序的启动入口，是整个小程序开发者工具的控制层，例如创建或者销毁webview等。它主要包括小程序的视图层的webview，业务逻辑层webview，调试器的webview和编辑区的webview几大块；我们只需关心视图层和业务逻辑层的webview。启动入口对应这一个index.html页面，里面引入主入口js，如下：
<div id=container class=container></div> <script src= </script>最终初次进入小程序主页后，主入口index.html的渲染html中有关视图层和业务逻辑层结果如下图所示：
由此可以证明，小程序开发者工具业务逻辑层是在webview中执行的，该webview虽然提供浏览器相关接口，但是小程序只是在其中单纯的执行js代码。
在我们小程序demo中有index首页navigateTo到logs日志页时，可以看主入口dom的变化，见下图：