给工程加上 NPM 和 TypeScript
脚本堆到几百上千行之后,改一个功能要翻很久,参数类型全靠记,第三方能力要么手写,要么干脆不用。EC 安卓 11.0 及以上给工程加了两样东西:NPM 用来装第三方库,TypeScript 用来做类型检查。
npm 怎么装,B 站和博客上都有,搜「安装 npm」也行。装完在命令行跑 npm -v,能打出版本号就可以。然后在工程上右键,选「新增 NPM 支持」。工程目录下会出现 package.json。之后在工程目录执行 npm install 类库名称,例如:
npm install md5
装完按 md5 库的说明直接用。npm 包有 web、node 等不同运行环境,EC 的 js 环境是纯 js。装之前先确认目标库是纯 js 实现。有的 npm 包在这个环境里跑不了。纯 js 库编进 iec 之后体积通常有限。能用原生 API 解决的,就先别引库。
TypeScript 的安装,runoob、CSDN 都有,搜「安装 TypeScript」也行。装好后在工程上右键,选「新增 TypeScript 支持」。工程目录会生成 tsconfig.json,同时给 libs 后面的 js 生成 d.ts。写代码时编辑器能提示方法签名和参数类型,有些低级错误在编译前就会被拦住。新增这些配置文件不影响现有脚本,公共逻辑可以之后再抽成 ts 模块。
两种写 ts 的方式,和混编建议
第一种写在 js 文件夹里,不用 require,也是更常推荐的写法。这个目录下的 js 会转成 java 字节码,所以不能用 require,也不要用 export 导出,但可以引用别的 js 文件。例如 js/Car.ts:
// 文件名称 js/Car.ts
class Car {
test(): void {
logd("i am car.")
}
}
保存时会自动生成 Car.d.ts 和 Car.js。别的 js 文件里直接 new:
// 文件名称 js/main.js
function main() {
let car = new Car();
car.test()
}
第二种写在 ts 文件夹里,要 export,调用处再 require:
// 文件名称 ts/Car1.ts
class Car1 {
test1(): void {
logd("i am car1.")
}
}
export = { Car1 }
在其他 js 文件中调用:
// 文件名称 js/main.js
function main() {
let car = require("ts/Car1")
let car1 = new car.Car1();
car1.test1()
}
官方文档里的混编建议,按这个顺序来。脚本的 js 和 ts 都放在 js 文件夹,不用 require,直接使用。UI 的 js 和 ts 放在 subjs 文件夹。别的工程要引用时,js 文件夹里的 js 和 ts 可以直接用,其他目录下的 ts 引不过去。一定要用 require 的话,把 js 和 ts 放到非 js 文件夹,并给 js 做混淆,避免核心逻辑被直接读出来。ts 源文件本身不进 iec,参与编译的是它生成的 js。类型定义只在开发时起作用。
想要真实跑起来?
本文介绍的方案均可基于 EasyClick 能力在 iEasyClick 落地。官网提供完整文档、开发工具与自动化产品,免费体验。