基础库-底层基础库解包|小程序原理专题

这个章节我们来进行底层基础库的解包。

首先我们来找一下基础库在哪里。

# 基础库

打开微信开发者工具界面找到这个位置。

这里显示着调试小程序运行的基础库版本。打开下拉之后可以看到很多基础库的版本，并且显示了每个版本用户使用的占比。

在微信开发者工具中可以选择指定的基础库版本进行小程序调试，这里的版本选择与微信客户端中的基础库版本无关。

怎么理解这句话呢？每个版本的微信客户端都会自带一个版本的小程序基础库。而不是微信客户端带着所有版本的基础库。

这种场景下就会有个问题，每个用户使用的微信客户端是不一样的，对应的小程序底层基础库版本肯定是不一样的，每个基础库版本之间是又一些差异，小程序开发的过程中一定会有兼容问题。通常都是使用最新的基础库来进行项目开发，相关文档中也标明了一些组件和方法所要求的最低基础库版本号。

所以在开发中要注意一些api的兼容问题，可以通过几种方式来处理：

• 比较版本号调用 wx.getSystemInfo 或者 wx.getSystemInfoSync 获取到当前小程序运行的基础库的版本号。
• API存在判断：通过判断该API是否存在来判断是否支持用户使用的基础库版本。
• wx.canIUse：通过 wx.canIUse 来判断是否可以在该基础库版本下直接使用
• 设置最低基础库版本：在小程序管理后台中设置最低基础库版本，如用户低于此版本，则进入不了小程序，并提示需更新微信版本。

并且开发小程序的时候一定要更新微信开发者工具版本。你经常会在打开微信开发者工具的时候看到这种弹窗。

可以看到微信开发者工具的更新就是基础库的更新，版本就是基础库的版本，所以在开发的时候一定要更新到最新版本的微信开发者工具。

# 寻找文件

接下来我们寻找基础库的文件的位置，其实在前面章节讲解的时候已经把文件所在位置暴露过了，不知道大家有没有印象。

在微信开发者工具的控制台界面，输入help()命令可见如所示界面。

可以看到这里有一些命令。我们继续在控制台执行第八条openVendor()命令。

这时候弹出了一个名为WeappVendor的文件夹。

可以看到上面带版本号的那些文件就是基础库包了，包的格式是.wxvpkg。

可以看到每个版本的基础库的包都在这里。基础库的代码就在这些包里。这个包我们是没有办法直接查看的。这个时候就需要一些手段来解包。

接下来我们就进行解包的过程。

# Unpack

这里我们取最新版本的基础库包来做解包过程的讲解，也就是上面图中的2.17.3版本，不过如果你看到这里的时候发现有更新的版本也可以用。

解包的工具我们选用wxappUnpacker，原作者不知道因为某些原因删除了仓库，但是没关系，github上搜这个名字的话还是有很多人有备份的，在这里放一下我备份的wxappUnpacker

我们clone一下wxappUnpacker项目到本地，并且拷贝需要解包的基础库到目录中，如下图：

首先把我们需要编译的基础库包拷贝到项目中，之后安装项目依赖。

$ npm install

依赖安装完成之后执行命令

$ node ./wuWxapkg.js 2.17.3.wxvpkg

执行完命令后项目中就多了一个dist文件夹：

看到如上图所示的话就解码成功了。目录中的WAWebview.js和WAService.js分别为渲染层底层基础库和逻辑层底层基础库。我们的主角登场。

我们打开WAWebview.js文件看一下：

可以看到代码是压缩过后的。这样的压缩过的代码是难以分析的，所以我们需要美化一下，可以看到package.json中有几条script命令：

这里我们执行一下:

$ npm run beautifyWAWebview
$ npm run beautifyAppService

把我们要分析的核心基础库文件都美化一下。再打开文件我们就可以看到美化之后的代码了：

这样我们就完成了解包基础库的流程，接下来章节我们就来分析一下基础库中都有哪些模块和功能。