前言

如何快速提高Laya構建速度 微信小游戲推出之后，很多公司也相應的進入到微信小游戲這個領域，現在市場上的游戲開發引擎，如Cocos、Egret、Laya都對小游戲有了很好的兼容性。而在實際開發中，如何提高Laya的構建速度，是游戲開發者非常想要解決的問題之一，下面，我們就來給大家梳理下。

一、默認的Laya構建方式

Laya在使用IDE默認創建項目后(本文選擇typescript語言)，會在當前項目目錄下，新建一個為.laya的文件夾。默認生成的編譯配置文件為

其中compile.js為開發時默認運行文件，這里如果開發者是mac系統，使用F8編譯項目后，可能都會報以下錯誤：

通過報錯提示，這里如果出錯的話，將compile.js名稱改為gulpfile.js，并且，將文件內gulp運行的默認task改為'default'。

通過compile.js文件可知，默認的Laya構建方式是，使用gulp、browserify進行項目構建，tsify編譯typscript，vinyl-source-stream用于將tsify構建的node stream轉化為gulp能識別的stream文件。所以我們每次修改ts源碼，都需要手動點擊編譯或者使用F8編譯。并且，就Laya的3D示例項目，每次編譯的時間基本在1s~2s。

二、改進的Laya構建方式

對于web前端開發，可能都會配置webpack+webpack-hot-middleware之類進行代碼熱更新，開發web網頁的流程基本就是：修改代碼 -> 自動編譯 -> 自動刷新，倘若有兩個屏幕，開發者不需要去刷新瀏覽器、輸入命令重新編譯等機械重復的行為。既然Laya默認使用了browserify（其實browserify這幾年更新已經很慢了），這里我們可以加入gulp.watch，觀察src目錄源文件，每當src下文件發生修改時，自動觸發編譯操作，相當于開發者不需要再按F8編譯。

但是這種方式，相當于gulp重新進行編譯，實際編譯速度依然不快。那么問題來了，有沒有辦法編譯對時候，gulp只編譯修改的那部分，從而加快編譯速度？

三、使用watchify監聽文件變化并結合browserify-sync自動刷新

通過gulp官網可了解到watchify到相關使用，這里我們將代碼改成，并結合browser-sync,帶來自動刷新網頁的功能。

1. `const watchedBrowserify = watchify(browserify({`2. `basedir: workSpaceDir,`3. `debug: false,`4. `entries: ['src/Main.ts'],`5. `cache: {},`6. `packageCache: {}`7. `}).plugin(tsify));`8. `// 記錄watchify編譯ts的時候是否出錯，出錯則不刷新瀏覽器let isBuildError = false;`9. `gulp.task("build", () => {`10. `return watchedBrowserify`11. `.bundle()`12. `.on('error', (...args) => {`13. `isBuildError = true;`14. `gutil.log(...args);`15. `})`16. `.pipe(source('bundle.js'))`17. `.pipe(gulp.dest(workSpaceDir + "/bin/js"));`18. `});`20. `gulp.task("watch", ['build'], () => {`21. `// 瀏覽器開發時自動刷新頁面`22. `browserSync.init({`23. `port: 3002, // 監聽端口，這里注意是否和其他項目沖突`24. `server: {`25. `watchFiles: ["../bin/"], // 刷新網頁的監控目錄`26. `baseDir: "../bin/"`27. `}`28. `});`29. `// watchify監聽文件刷新`30. `watchedBrowserify.on("update", () => {`31. `isBuildError = false;`32. `runSequence('build', () => {`33. `if(!isBuildError) { // 沒有編譯錯誤時，刷新瀏覽器界面`34. `browserSync.reload();`35. `}`36. `});`37. `});`38. `// 打印watchify編譯日志`39. `watchedBrowserify.on("log", gutil.log);`40. `});`

其中，runSequence用于同步執行gulp任務，多次實踐，這里還需要加入變量isBuildError，在代碼編譯出錯時，不執行browserSync的刷新。最終效果：

編譯速度快了近10倍，瀏覽器也能自動刷新了，能極大地提高程序員的工作效率。

總結

以上是生活随笔為你收集整理的identity_insert 如何改为on_十分钟教你如何快速提高Laya构建速度，还不快来康康？...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。