在这之前已经描述了0.57版本的react native如何拆包:https://blog.csdn.net/tyro_smallnew/article/details/83088216(React native拆包的正确姿势),对于原生如何加载多个js包的方法只是简单的描述下,现在开始补坑。
0、rn之jsbundle
当然我们都知道jsbundle是什么(就是我们打包出来的js包,~~等于没说),直接look look
名字长这样:
其实这里面是个文本,打开长这样:
WHAT?这都是些什么?
第一行是对当前运行环境的定义,是不是开发环境?启动的时间、还有进程环境
第二行是对require、define的支持,还有我们module加载的逻辑也是在第二行实现的
当然还有第三行第四行。。。。。
可以打测试包来展现这些代码原来的样子:(--dev指定为false就不会混淆了)
react-native bundle --platform android --dev false --entry-file index.js --bundle-output ./android/app/src/main/assets/index.android.bundle
var __DEV__=false,__BUNDLE_START_TIME__=this.nativePerformanceNow?nativePerformanceNow():Date.now(),process=this.process||{};process.env=process.env||{};process.env.NODE_ENV="production";
(function (global) {
"use strict";
global.__r = metroRequire;
global.__d = define;
global.__c = clear;
var modules = clear();
var EMPTY = {};
var _ref = {},
hasOwnProperty = _ref.hasOwnProperty;
function clear() {
modules = typeof __NUM_MODULES__ === "number" ? Array(__NUM_MODULES__ | 0) : Object.create(null);
return modules;
}
function define(factory, moduleId, dependencyMap) {
if (modules[moduleId] != null) {
return;
}
modules[moduleId] = {
dependencyMap: dependencyMap,
factory: factory,
hasError: false,
importedAll: EMPTY,
importedDefault: EMPTY,
isInitialized: false,
publicModule: {
exports: {}
}
};
}
function metroRequire(moduleId) {
var moduleIdReallyIsNumber = moduleId;
var module = modules[moduleIdReallyIsNumber];
return module && module.isInitialized ? module.publicModule.exports : guardedLoadModule(mod