mydemo11

v202440.1.1

Published

2 years ago

1. 主要逻辑在 `generateCode.js` 2. 通过[astexplorer](https://astexplorer.net/)把需要转化成的代码，转化成对应的ast，然后按需拼凑ast用来最终代码生成, 或通过 `@babel/parser` 解析代码，获得`ast`，通过 `@babel/generator` 生成代码 #### build

0High
0Medium
0Low

charlessoft

JSPluginSDK

主要逻辑在 generateCode.js
通过astexplorer把需要转化成的代码，转化成对应的ast，然后按需拼凑ast用来最终代码生成, 或通过 @babel/parser 解析代码，获得ast，通过 @babel/generator 生成代码

build

  npm run g # 同时生成 js 和ts
  # or
  npm run gts # 只生成ts
  npm run gjs # 只生成js

使用babel/generator 转换ts为ast

在 web/ast/2ast/2Ast.js 粘贴需要转换的code
运行 npm run ast 即可在 web\ast/2Ast 下生成对应的json
打开 web/ast/2ast 下的json，查看对应的ast
自行获取需要转化的ast已做备用

开发plugin-engine(js wallpaper)接口

首先运行 npm i or yarn 安装依赖
运行 npm run g 生成ts/js代码 ==> generated文件夹，此文件夹代码是自动生成，不要手动修改任何代码，否则下次自动生成会覆盖掉
在 plugin-engine\ts 文件夹中编写相关接口，如：JSFR_App_V1.ts 中 getName
- 原则上所有接口是参照 generated 文件的接口，但实际有些接口时不需要实现的
- 所以实际上只需要实现接口文件夹下必须实现的接口接口
- 所以必须实现的接口，参照：fr_appImplWrapper.h 中 REGISTER_FUNC，其他类的接口也是类似的查找(如不清楚，可以咨询群里其他开发者)
- generated 下的 js，是提供给 c++ 开发人员验证中间层接口使用的，可以不用理会，c++开发人员使用的demo验证
- 高级接口使用senior-demo 验证 (ts)
- senior-demo demo使用，只需要新建对应的components文件夹,它会自动处理组件引入，当然有些组件可以写在一个vue文件中，例如：Destroy.vue 就是包含2个button测试用例
- plugin-engine\ts 下的文件夹结构是和generated对应的，有一些是原样导入，但大部分是不是，可以参考已有文件
- 特别注意 callback 下的文件，由于要使用 typedoc 生成文档，所以编写是要特殊处理下，详细可以参照某一个例子即可
- 如果需要修改PluginSDK\Plugins\JSPluginManager\web\src\lib下逻辑以改变自动生成 generated 代码，需要和c++人员沟通对接修改
- 特别注意: 在所有接口中，如果返回的值是一个接口对象, 则需要使用set方法将返回的result重新设置，原因是：当前的接口类，继承至对应中间层接口类，会产生多余 {uuid: xxx, value: xxx}, 这个uuid实际上是没有任何意义的，且会造成干扰
```
async new(obj: FPDObject): Promise<FPDDest> {
    const result = await this.New(obj);
    const dest = new FPDDest();
    dest.set(result);
    return dest;
}
```