Laya 1.x 按文件夹TS代码合并
Laya 1.x 使用TS开发时,经常会碰到代码文件太多,加载index.html时时间太长的问题。Laya编辑器貌似没有自带JS代码合并的功能。基于Laya去实现JS合并需要修改编辑器源码,合并JS并且要修改导出index.html,实现起来比较麻烦,所以考虑合并发布前的TS代码,这样可以正常使用Laya的发布流程,缺点就是修改代码时,需要先恢复源码,修改完再合并,稍微繁琐一点。尽量在稳定后,发布时合并一次即可。
环境配置
- 工具:gulp、glup-concat、del、gulp-rename
- 配置步骤:
- 进入项目根目录,打开命令行。
- 执行
npm init
初始化npm,根据需要填入对应信息,默认一直点回车即可。 - 执行
npm install gulp --save-dev
安装gulp - 执行
npm install gulp-concat --save-dev
安装gulp-concat插件 用于合并TS代码。 - 执行
npm install del --save-dev
安装del插件 用来删除文件 - 执行
npm install gulp-rename --save-dev
安装gulp-rename插件,用于文件改名,如果用不到也可以不安装。
- 在根目下创建gulpfile.js,用于写工具相关配置。
工具实现:
工作流程:备份src下代码->合并src下代码到src/output下->删除src下源代码->清理bin/js文件->复制导出用index->在编辑器中编译导出。
备份代码实现:
//备份源代码
gulp.task('backup', function() {
return gulp.src(['src/**/*'])
.pipe(gulp.dest('../backup'));
});
将src/的所有文件,复制到../backup文件夹中。
注意:备份地址不要放在根目录下,否则Laya会去读取这个文件,容易产生多次定义的bug。
可以在命令行中执行gulp backup
测试脚本执行。之后步骤均可使用这种方式测试单个命令。合并代码实现:
合并代码时需要控制文件的合并顺序,防止子类在父类之前定义的问题,这样编译TS时会报错。
最理想情况是解析导出的index.html按照顺序依次合并,但实现起来比较复杂。这里手动控制父类的文件先合并,其他文件在合并。
大部分情况下,只有几个文件或者文件夹需要提前处理,工作量并不是很大。只要保证父类在前就可以。
合并的粒度可以自己控制,可以合成一个文件,也可以按src下文件夹合并,或者更细的粒度。//合并frame文件夹
gulp.task('frame', function() {
return gulp.src([
'src/frame/A/**/*.ts', //先合并A文件夹下所有文件
'src/frame/B/B.ts', //合并B下的B.ts
'src/frame/C/*Base*.ts', //合并C下所有含有Base的问题
'src/frame/**/*.ts', //合并frame下的其他所有文件
])
.pipe(concat('frame.ts'))
.pipe(gulp.dest('src/output'));
});
注:如果不是在根目录下执行脚本,如'../src/xxxxx',合并时特殊文件会被多合一次,还没有找到原因。
删除源代码:
//删除合并前代码
gulp.task('delsource', function(){
return del([
'src/**',
'!src/output',
'!src/output/*',
'!src/ui',
'!src/ui/*',
'!src', ], {force:true});
});
保留src下的output文件夹和ui文件夹。
要保留文件夹下的文件,需要先保留文件夹。删除bin/js
//删除bin下面js
gulp.task('cleanBinJs', function(){
return del([
'bin/js/**',
], {force:true});
});
清理之前的js文件
复制发布用index.html
发布的index和开发的index可能不一样,尤其是在标签中定义文件时。这里是将发布用的index替换到bin下面。//拷贝开发index
gulp.task('copyIndex', function()
{
return gulp.src('index/release.html') //找到文件
.pipe(rename('index.html')) //将文件改名
.pipe(gulp.dest('./bin/')); //拷贝到bin下面
})
设置一键脚本
//打包代码
gulp.task('merage', gulp.parallel('A', 'B', 'C')); gulp.task('release', gulp.series('backup','merage', 'delsource', 'cleanBinJs', 'copyIndex'));
ABD为要合并的文件夹。
只需要在命令行中执行
gulp release
就会一键执行上面所有操作。最后再编辑器中发布即可。
Laya 1.x 按文件夹TS代码合并的更多相关文章
- 【原】Mac下统计任意文件夹中代码行数的工具——cloc
这里介绍一个Mac系统统计代码行数的工具cloc. 1.首先,安装homebrew,已安装的请跳过. 打开终端工具Terminal,输入下列命令.过程中会让你按RETURN键以及输入mac桌面密码,按 ...
- java压缩指定目录下的所有文件和文件夹的代码
将代码过程较好的代码段备份一下,下边资料是关于java压缩指定目录下的所有文件和文件夹的代码,希望对码农有帮助. String sourceDir="E:\test";int pa ...
- 【原】Mac下统计任意文件夹中代码行数的工
[链接][原]Mac下统计任意文件夹中代码行数的工http://www.cnblogs.com/wengzilin/p/4580646.html
- summernote图片上传功能保存到服务器指定文件夹+php代码+java方法
1.summernote富文本编辑器 summernote是一款基于bootstrap的富文本编辑器,是一款十分好用的文本编辑器,还附带有图片和文件上传功能. 那么在我们网站中想吧这个图片上传到服务器 ...
- OC获取文件(夹)的代码行数
/* 考察NSString NSArray NSFileManager */ #import <Foundation/Foundation.h> /* 计算单个文件的代码行数 path:文 ...
- linux grep find查找文件夹、代码中的某行/字符串
本文转载于:https://blog.csdn.net/Mr_Cat123/article/details/80541658 在Linux中,由于文件很多,代码很长,可能我们只知道其中的一两个字符串, ...
- Java_文件夹分割与合并
一.思路: 1.文件切割: 使用类RandomAccessFile ,其中方法seek可以自定义读取位置,读一段,通过字节输出流(我使用BufferedOutputStream)写一段 2.文件合并 ...
- canvas生成图片并保存到本地文件夹主要代码
js var url = canvas.toDataURL();//把canvas中的图片变成data:image C# string filepath = ""; string ...
- 目前为止最简洁的C#文件夹Copy代码,不接受反驳
private static void CopyEntireDir(string sourcePath, string destPath) { foreach (string dirPath in D ...
随机推荐
- 【译文】MySQL InnoDB 事物模型
InnoDB事物模型 事物的隔离级别 自动提交,提交和回滚 一致的非锁定读 锁定读 在InnoDB事物模型中,目标是为了多版本数据库和传统的俩段锁协议的最佳实践(多版本并发控制).InnoDB在行级别 ...
- IDEA 使用技巧 Update
IDEA使用起来和Eclipse很大区别. 1.快捷键. 因为一个个熟悉起来费时间,就直接在Preferences—keymap里选择了Eclipse OS X,这样快捷键就转换到了Mac下Eclip ...
- 为什么会有object这么一个根基类
先问一个问题,为什么需要有一个统一的基类:Object?甚至,我们在编程语言中也常常见到这种模式,比如Java中的object.C#的object,甚至一些纯对象的脚本语言(Ruby里连数字123都是 ...
- 【转】numpy-array自带的迭代器-----np.nditer
转自:https://www.jianshu.com/p/f2bd63766204 it = np.nditer(x, flags=['multi_index'], op_flags=['readwr ...
- Python之括号()[]{}
Python主要有三种数据类型:字典.列表.元组.其分别由花括号,中括号,小括号表示.如:字典:dic={'a':12,'b':34}列表:list=[1,2,3,4]元组:tup=(1,2,3,4)
- 1553: Good subsequence (很奇妙的set模拟题,也可以直接暴力)
1553: Good subsequence Submit Page Summary Time Limit: 2 Sec Memory Limit: 256 Mb Subm ...
- NAS、SAN、ISCSI存储
前提补充:linux下只要能够mount存储盘到目录,则这个存储盘必定是格式化过了的 NAS1.客户端通过TCP/IP协议连接存储服务器的存储卷.2.客户端---网络交换机---存储服务器3.存储服务 ...
- CentOS7.6离线安装MySql5.7
准备好mysql的离线安装文件: MySql官网下载mysql-5.7.25-1.el7.x86_64.rpm-bundle,并复制到/usr/mysql文件夹中. 删除CentOS自带的MariaD ...
- 在 Mac 上通过 Docker 运行 Asp.net Core 简易教程
首先,你需要在 Mac 上安装好 Docker 下载地址 https://download.docker.com/mac/stable/Docker.dmg 或者查看别人的 安装教程 怎么安装这里就不 ...
- 版本管理工具git与svn简介
版本管理工具 版本管理工具简介 常见版本管理工具 cvs(Concurrent Versions System) vss(Visual SourceSafe) svn 常用的版本管理工具 git 流行 ...