方案
- 生成未壓縮混淆的游戲整包 wxgame.js
- 截取中間部分標(biāo)記切割wxgame.js為兩個(gè)wxgame.js
- 把依賴包含到window上
示例
gulp task配置
/**
* 編譯成單個(gè)js 不創(chuàng)建 window.a =a ;
*
* @param {*} fileName 生成的名字
* @param {*} outPath 輸出路徑
* @returns
*/
function compileWXTSFile(outPath, fileName) {
// 混淆參數(shù)
const uglifyOptions = {
mangle: true,// 混淆
compress: false // 不壓縮
}
return gulp.src([
"libs/*.ts",
"src/**/*.ts"
])
.pipe(sorter(false)) // 排序 false 不顯示日志
.pipe(tsProj()) // 編譯TS文件
.pipe(concat(fileName)) // 合并編譯后的js到一個(gè)文件
.pipe(gulp.dest(outPath))
}
/**
* 篩選出 window.a=a 生成獨(dú)立js
*/
function createWXExport() {
// 進(jìn)行編譯 不進(jìn)行混淆
return gulp.src([
"libs/*.ts",
"src/**/*.ts"
])
.pipe(sorter(false)) // 排序 false 不顯示日志
.pipe(tsProj()) // 編譯TS文件 // 讀取已經(jīng)混淆好的整包
.pipe(wxTools(true)) // 篩選頂層引用 用 window.a = a 包含
.pipe(concat("wxgame_export.js"))
.pipe(gulp.dest("wxgame_out/"))
}
/**
* 添加 window.a=a 到尾部
* @param { } inFile
* @param {*} outPath
* @param {*} outFileName
*/
var conactExport = function (inPath, outPath, fileName) {
return gulp.src([
inPath + fileName,
gameJSExport,
])
.pipe(concat(fileName))
.pipe(gulp.dest(outPath))
.on("end", () => {
console.log("sub success =>> ", outPath, fileName)
})
}
/**
* 分包
* @param {string } path 切割后輸出路徑
* @param {string} fileName 生成文件名
* @param {boolean} isLast
* @param {string } head
*/
function subWX(tempPath, outPath, fileName, isLast, head) {
var key = `define("game/battle/control/BattleDataControl"`
var uglifyArgs = {
mangle: false, // 分包不再進(jìn)行混淆 只壓縮空白
compress: {}
}
return gulp.src([gameJS,])
.pipe(wxSub(key, isLast, head))
.pipe(wxTools()) // 篩選頂層引用 用 window.a = a 包含
.pipe(concat(fileName))
// .pipe(uglify(uglifyArgs)) //打開則進(jìn)行混淆這里方便調(diào)試
.pipe(gulp.dest(tempPath))
.on("end", () => { // 結(jié)束后
return conactExport(tempPath, outPath, fileName);
})
}
// 微信分包
gulp.task('wxsub', function (args, args2) {
var head = `var Laya = window.Laya;\n`;
var head2 = ` var Laya = window.Laya;var __extends = window.__extends;\n`;
// 編譯
if (compile && compile.c != null) {
console.log("start wx compile");
return compileWXTSFile("wxgame_out", "wxgame.js").on("end", () => {
console.log("compileWXTSFile Finish");
createWXExport().on("end", () => {
subWX("wxgame_out/sub1/", "wxgame/sub1/", "wxgame.js", false, head);
subWX("wxgame_out/sub2/", "wxgame/sub2/", "wxgame.js", true, head2);
})
})
} else {
// 不編譯 直接拿已經(jīng)編譯的進(jìn)行切割
subWX("wxgame_out/sub1/", "wxgame/sub1/", "wxgame.js", false, head);
subWX("wxgame_out/sub2/", "wxgame/sub2/", "wxgame.js", true, head2);
}
});
gulp 插件
根據(jù)key截取代碼
'use strict';
var through = require('through2');
var path = require('path');
var File = require('vinyl');
var Concat = require('concat-with-sourcemaps');
var gutil = require('gulp-util');
var PluginError = gutil.PluginError;
/**
* 微信分包工具 被冒，基于amd模式下開發(fā)的游戲
* 將 var XXX 包裝到 window.XXX =XXX;
* @param key 分包關(guān)鍵位置
* @param isLast 是否是取后面的
* @param isMain 是否是主包 主包不分包 但是加頭部
*/
var wxgameSubTools = function (key, isLast, head, isMain) {
function onFile(file, enc, cb) {
if (file.isStream()) {
console.error('Streams are not supported!');
return cb();
}
let contents = "" + file.contents;
let outStr;
if (!isMain) {
if (key == null || key == "") {
console.error("key ", 'key= ' + key);
return cb();
}
const index = contents.indexOf(key);
if (index == -1) {
console.error('not find key ! key= ' + key);
return cb();
}
if (!isLast) { //
outStr = contents.substr(0, contents.indexOf(key));
} else {
outStr = contents.substr(contents.indexOf(key));
}
}else{
outStr = contents;
}
// 頭部添加的文本
if (head) {
outStr = head + outStr;
}
file.contents = new Buffer(outStr);
cb();
this.emit("data", file);
}
// 不處理end 使用默認(rèn)的end
return through.obj(onFile);
};
module.exports = wxgameSubTools;
生成分包 ,提取依賴到window
'use strict';
var through = require('through2');
var path = require('path');
var File = require('vinyl');
var Concat = require('concat-with-sourcemaps');
/**
* 微信分包工具 军掂，基于amd模式下開發(fā)的游戲
* 將 var XXX 包裝到 window.XXX =XXX;
* @param {boolean } isExport 是否是只輸出window.a=a
*/
var wxgameTools = function (isExport) {
/**
* 流處理 匹配 /(?:^|\n)(function|var) [_0-9a-zA-Z]+/ig; 添加為 window.XXX = XXX;
*
* @param {*} file 流文件
* @returns
*/
function onFile(file, enc, cb) {
if (file.isStream()) {
this.emit('error', new PluginError(PLUGIN_NAME, 'Streams are not supported!'));
return cb();
}
var contents = "" + file.contents;
// 匹配fuanction XXX 或者 var XXX
var reg = /(?:^|\n)(function|var) [_0-9a-zA-Z]+/ig;
// 匹配fuanction 或者 var 去掉 function 或者 var
var reg2 = /(?:^|\n)(function|var) /ig;
var match = contents.match(reg)
if (match && match.length > 0) {
var strs = ""
for (var i = 0; i < match.length; i++) {
var str = match[i].replace(reg2, "");
strs += "\n try{window." + str + "=" + str + ";}catch(e){console.warn("+'"'+str+'")}';
}
var bf = new Buffer( strs ); // 提前分配
if(isExport){
file.contents = bf;
}else{
file.contents = Buffer.concat([file.contents, bf])
}
}
cb();
this.emit("data",file);
}
// 不處理end 使用默認(rèn)的end
return through.obj(onFile);
};
module.exports = wxgameTools;
