当前位置：首页 > news >正文

awtk踩坑记录二：移植jerryscript到awtk design项目

news 2025/6/29 18:36:18

工作要求，想尝试看看在awtk-designer设计界面的同时能不能用javascript开发逻辑层，以此和前端技术联动，本文是一种项目建构的思路。

从github下载并编译awtk, awtk-mmvm和awtk-jerryscript（如果没有）
用awtk-designer新建项目，awtk和awtk-mmvm路径改为上一步github下载到的目录路径（如designer改不了，可在project.json上修改）
从awtk-jerryscript复制3rd/jerryscript，src改名为jerryscript_src到designer项目上
修改designer项目根目录Sconstruct为：

import os
import scripts.app_helper as appARGUMENTS['FONT'] = 'default_full'
helper = app.Helper(ARGUMENTS);TK_JERRYSCRIPT_ROOT = os.path.join(helper.APP_ROOT, '3rd/jerryscript/')TK_JS_JERRYSCRIPT_DIRS = [TK_JERRYSCRIPT_ROOT,os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-ext/include'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-ext/arg'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-ext/common'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-ext/debugger'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-ext/handler'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-ext/module'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/include'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/ecma'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/ecma/base'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/ecma/builtin-objects'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/ecma/operations'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/jcontext'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/jrt'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/parser'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/parser/js'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/parser/regexp'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/vm'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/api'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/debugger'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/lit'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/jmem'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/profiles'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-port/default/include'),os.path.join(TK_JERRYSCRIPT_ROOT, 'jerryscript/jerry-core/ecma/builtin-objects/typedarray'),
]APP_CPPPATH = TK_JS_JERRYSCRIPT_DIRS
APP_LIBS = ['awtk-jerryscript', 'jerryscript']
APP_CCFLAGS = '-DPATH_MAX=256 -DJERRY_ESNEXT=0 'helper.add_libs(APP_LIBS).add_ccflags(APP_CCFLAGS).add_cpppath(APP_CPPPATH).call(DefaultEnvironment)if ARGUMENTS.get('IOTJS', '') != '':SConscriptFiles = ['src/SConscript']
else:SConscriptFiles = ['3rd/jerryscript/SConscript', 'jerryscript_src/SConscript', 'jerryscript_src/SConscript.bin']CUSTOM_WIDGET_LIBS = []DEPENDS_LIBS = CUSTOM_WIDGET_LIBS + []helper = app.Helper(ARGUMENTS)
helper.set_deps(DEPENDS_LIBS)app.prepare_depends_libs(ARGUMENTS, helper, DEPENDS_LIBS)
helper.call(DefaultEnvironment)SConscriptFiles += ['src/SConscript', 'tests/SConscript']
helper.SConscript(SConscriptFiles)

designer项目awtk_locator.py的getAwtkSDKPath修改，使其返回自己awtk安装的所在目录

def getAwtkSDKPath():# env = os.environ# if 'AWTK_SDK_PATH' in env:#     return env['AWTK_SDK_PATH']# else:#     return ''return 'D:/Devtools/'

将awtk-jerryscript目录design/default/scripts/awtk.js复制到designer项目的对应路径下，否则awtkRun可能无法加载窗口

移植awtk-jerryscript的font目录到desginer项目对应路径下合并原font目录，否则awtkRun打开js文件将无法显示文字。

完成以上两步后一定要更新资源：

  python ./scripts/update_res.py all

在designer项目src下新建js文件夹，以后页面逻辑有关的所有js文件就存放于此，并新建build_js.json，用于以后在awtk-web的部署，注意json中sources写明js源文件路径，例：

build_js.json

{"name": "AwtkApplication3","version": "1.0","assets": "res/assets","author": "AWTK Develop Team","copyright": "Guangzhou ZHIYUAN Electronics Co.,Ltd.","themes":["default"],"web": {"app_type": "js","assets": "design","sources": ["src/js/*.js"],"config": {"fontScale": "0.8","defaultFont": "sans"}}
}