白鷺H5合并為單個HTML文件(Facebook試玩游戲)

  • 在發(fā)布之前,需要把項(xiàng)目中用到的所有圖片轉(zhuǎn)化為base64
        // 將base64轉(zhuǎn)化為紋理(舊版)
        let img = document.createElement("img");
        let texture:egret.Texture = new egret.Texture();
        img.src = 'base64';
        img.onload = () => {
            let bitmapdata:egret.BitmapData = new egret.BitmapData(img);
            texture.bitmapData = bitmapdata;
        }
        // 將base64轉(zhuǎn)化為紋理(新版,base數(shù)據(jù)不用加data:image/png;base64,)
        private static async get_Texture(base64:string) {
          let response =await new Promise( resolve => {
            egret.BitmapData.create('base64', base64, bitmapdata => {
                let texture:egret.Texture = new egret.Texture();
                texture.bitmapData = bitmapdata;
                resolve(texture)
            })
          })
          return response
        }

        // 紋理數(shù)據(jù)json 文件轉(zhuǎn)化為對象(dragondones使用)
        let textureDate = JSON.parse('json文件復(fù)制過來');
  • 白鷺游戲發(fā)布為h5之后,因?yàn)閳D片都是base64,所以resource文件是不需要的


    白鷺游戲發(fā)布為h5之后
  • 使用gulp合并js,需要合并的js在js文件夾里, 地址在manifest.json中,順序跟manifest.json里面一樣 gulp快速入門

// gulpfile.js
var gulp=require('gulp'),  //gulp基礎(chǔ)庫
    concat=require('gulp-concat');  //合并文件

    gulp.task('default',function(){
            return gulp.src([
                'src/js/egret.min_7205852b.js',
                'src/js/egret.web.min_83336927.js',
                'src/js/game.min_3c096da1.js',
                'src/js/tween.min_6c5a88f9.js',
                'src/js/assetsmanager.min_2c9a3f2e.js',
                'src/js/promise.min_83a6a5d.js',
                'src/js/physics.min_d425a559.js',
                'src/js/particle.min_27fe451d.js',
                'src/js/main.min_b3b54556.js'
            ])  //選擇合并的JS
            .pipe(concat('index.js'))   //合并js
            .pipe(gulp.dest('dist/js'))         //輸出
    });
  • 在html的head部分增加一個script標(biāo)簽,把合并完成的js文件復(fù)制到script中,如果js文件中的有其他script標(biāo)簽,需要查找出來刪掉(想不到其他辦法)

  • 發(fā)布完成的html文件中有一部分ajax請求的代碼,將整個ajax請求的代碼都注釋掉,僅留下最終要執(zhí)行的代碼,例如我的是:

//...
// var xhr = new XMLHttpRequest();
    // xhr.open('GET', './manifest.json?v=' + Math.random(), true);
    // xhr.addEventListener("load", function () {
    //     var manifest = JSON.parse(xhr.response);
    //     var list = manifest.initial.concat(manifest.game);
    //     loadScript(list, function () {
            egret.runEgret({ renderMode: "webgl", audioType: 0, calculateCanvasScaleFactor:function(context) {
                var backingStore = context.backingStorePixelRatio ||
                    context.webkitBackingStorePixelRatio ||
                    context.mozBackingStorePixelRatio ||
                    context.msBackingStorePixelRatio ||
                    context.oBackingStorePixelRatio ||
                    context.backingStorePixelRatio || 1;
                return (window.devicePixelRatio || 1) / backingStore;
            }});
    //     });
    // });
    // xhr.send(null);

編輯于2019/02/27 廣州 今天沒下雨

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML標(biāo)準(zhǔn)。 注意:講述HT...
    kismetajun閱讀 28,809評論 1 45
  • $HTML, HTTP,web綜合問題 1、前端需要注意哪些SEO 2、 的title和alt有什么區(qū)別 3、HT...
    Hebborn_hb閱讀 4,774評論 0 20
  • 在現(xiàn)在的前端開發(fā)中,前后端分離、模塊化開發(fā)、版本控制、文件合并與壓縮、mock數(shù)據(jù)等等一些原本后端的思想開始...
    Charlot閱讀 5,659評論 1 32
  • gulpjs是一個前端構(gòu)建工具,與gruntjs相比,gulpjs無需寫一大堆繁雜的配置參數(shù),API也非常簡單,學(xué)...
    井皮皮閱讀 1,401評論 0 10
  • 魚和我是一起來的日本。起初他并沒有任何想來日本的跡象,甚至還以為大學(xué)以后我們就向左走向右走了。 我們都是一邊送...
    Yoroko閱讀 238評論 0 0

友情鏈接更多精彩內(nèi)容