TypeScript写的方法怎么提供给外面的JS调用

Creator 3.x
#1

用TypeScript封装的方法想写成接口，提供给打包(打包成Web工程)后生成的index.html内的js调用

1赞
#2

可以通过window[“xxx”] = typeScript封装的类，在index.html中的js中用parent.xxx可以获取到类，这样就可以或得到类里面的方法了，然后可以直接调用。

#3

谢谢，再问下，那window[“xxx”] = typeScript这句话写在什么地方吗

#4

我也是，找了好几天的资料，看上面给方法，突然想到了，这么写可以用js调用cocos里面的ts方法：
cocos的：
import { _decorator, Component, Node } from ‘cc’;
const { ccclass, property } = _decorator;

@ccclass(‘tstojs’)
export class tstojs extends Component {

start () {
    
     //把cc里面的jscallts给window
     window.jscallts = this.jscallts.bind(this);
}

public jscallts(){
    console.log("ts to js");
}

}

index.html中的js:

function callts() {
parent.jscallts();
}
浏览器中成功调用到了：

但是把我这也是有个问题，就是必须在cocos资源文件加载完毕了，才能调用，但如何判断cocos加载完毕呢？我还没找到方法，谁知道这个给说说~:smirk:

#5

之前有在群里回这个问题，
这个就是全局变量，HelloWorld是我定义的函数。
另外你也可以采用export的方式（用js的写法），比如你有个Test脚本，你创建了它但是没有什么export class **** extends Component {} 就直接写：export function clearFrames() {
frames = [];
}，那你在任何地方都可以调用它。

#6

好的 谢谢

#7

好的 谢了

#8

mark1111

#9

mark1

#10

确实，最简单的方法就是用全局变量。

关于 “这句话写在什么地方” 的问题，要简单了解一下脚本执行的时机。Creator 会先初始化引擎，并且在加载首个场景之前执行所有项目脚本。那么其实你在项目脚本里面可以随便写个脚本：

import * as F1 from '第一个功能模块';
import * as F2 from '第二个功能模块';

const F = Object.assign({}, F1, F2);
globalThis['F'] = F;

然后在你的外部 js 里调用就好啦。

#11

大哥问下 执行所有项目脚本的顺序遵循什么规则 是 a 开头优先这样吗

#12

项目脚本是的，项目脚本会按字母序排序执行。但是实际执行顺序还遵循 ESM 模块的规则，比如 ABC三个脚本，正常情况下，会先后执行 ABC，但如果 A依赖C，那么最后会是 ACB。