工作需求，接觸了awtk, 要求把界面部署到web上，期間因?yàn)楦鞣N編譯問(wèn)題卡的半死，提了不少issue, 經(jīng)過(guò)幾天補(bǔ)課，把項(xiàng)目的編譯結(jié)構(gòu)給摸了一遍，做個(gè)記錄，也希望能幫到有同樣問(wèn)題的朋友。

之前python只是略接觸過(guò)，第一次見(jiàn)過(guò)正規(guī)項(xiàng)目用python編譯，還嘗試自己調(diào)試追蹤過(guò)程，感覺(jué)也成長(zhǎng)了不少。

測(cè)試方法：vscode下用python插件F5 debug, debug方式選擇command line arguments
放編譯build.py的方法以方便CV：

./emsdk_env
cd ../awtk-web
python build.py D:\AWStudioProjects\Workspace\AwtkApplication3\build.json all

build.py入口：

def run(app_root, config, action):prepare_app_target_dir(config)prepare_export_funcs(app_root, config)if action == 'all':build_app_assets(app_root, config)build_awtk_js(app_root, config, ' -g4 -gsource-map ')build_awtk_web_js(config)
...

1.build_app_assets：生成webroot映像，加載項(xiàng)目資源

• 從目標(biāo)的build.json【本例目標(biāo)名AwtkApplication3， python變量名config】中指定的路徑copy資源到awtk-web的對(duì)應(yīng)的design目錄，project.json, data/app.html和data/index.html,。
• 調(diào)用update_res.py更新資源res目錄

build.json

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

build.py

#src_app_root='D:\\AWStudioProjects\\Workspace\\AwtkApplication3'
#config是目標(biāo)項(xiàng)目的build.json對(duì)象
def build_app_assets(src_app_root, config):#生成對(duì)應(yīng)項(xiàng)目在awtk-web/webroot的對(duì)應(yīng)映像，并復(fù)制項(xiàng)目design文件夾到映像目錄下copy_assets(src_app_root, config)   #復(fù)制對(duì)應(yīng)項(xiàng)目project.json到對(duì)應(yīng)映像目錄下copy_project_json(src_app_root, config) #復(fù)制awtk-web的html模版app.html及index.html到對(duì)應(yīng)映像copy_data_file(config, 'app.html')      copy_data_file(config, 'index.html')#更新對(duì)應(yīng)映像的assets:為目標(biāo)映像生成script文件夾和res文件夾以及assets_web.jsupdate_assets(config)       #構(gòu)建對(duì)應(yīng)的romfs文件系統(tǒng)（如果有），一般不需要build_romfs(app_root, config);

#src = 'scripts'
#dst = 'D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\scripts'
def prepare_update_res(config):src = 'scripts'dst = join_path(config_get_app_target_dir(config), 'scripts')copy_folder(src, dst)#return: 'D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3'
def config_get_app_target_dir(config):return join_path(WEB_ROOT, config['name'])def update_assets(config):#復(fù)制awtk-web的scripts文件夾到目標(biāo)項(xiàng)目的webroot映像下prepare_update_res(config)#獲取目標(biāo)項(xiàng)目的webroot映像目錄config_get_app_target_dir(config)""" 運(yùn)行update.res.py更新資源，相當(dāng)于cd D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3本地系統(tǒng)python ./scripts/update_res.py res 本地系統(tǒng)python ./scripts/update_res.py json 本地系統(tǒng)python ./scripts/update_res.py web    cd D:\\Devtools\\awtk-web
"""cwd = os.getcwd()app_target_dir = config_get_app_target_dir(config)os.chdir(app_target_dir)os.system('\"'+sys.executable+'\"' + ' scripts/update_res.py res')# 此步生成映像的assets_web.jsos.system('\"'+sys.executable+'\"' + ' scripts/update_res.py json')os.system('\"'+sys.executable+'\"' + ' scripts/update_res.py web')os.chdir(cwd)

2.build_awtk_js：為映像生成awtk.js，awtk_asm.js，awtk_asm.wasm

步驟一：將AWTK_SRC_DIR下所有c庫(kù)文件(awtk.getWebFiles()獲取), awtk-web目錄下符合正則src/c/*.c的所有文件(web_files), gen/c/awtk_wrap.c（如果目標(biāo)項(xiàng)目是由js構(gòu)成），以及項(xiàng)目build.json的sources屬性指定的所有c/cpp源文件，加入文件列表all_files，并用emscripten自帶的emcc編譯, 輸出awtk.js和awtk_asm.js。

def build_awtk_js(src_app_root, config, flags):app_target_dir = config_get_app_target_dir(config)app_files = []#如果目標(biāo)項(xiàng)目是js類型，將awtk-web的gen/c/awtk_wrap.c加入if(is_js_app(config)):app_files.append(join_path('./', 'gen/c/awtk_wrap.c'))#提取目標(biāo)項(xiàng)目的所有c源文件加入到app_files列表供編譯#源文件路徑取自目標(biāo)項(xiàng)目build.json的sources列表sources = config['sources']for f in sources:if f.endswith('.c') or f.endswith('.cpp'):app_files = app_files + glob.glob(f)#提取awtk-web的所有c源文件加入web_files列表供編譯web_files = glob.glob('src/c/*.c')#awtk.getWebFiles()獲取awtk目標(biāo)下所有庫(kù)文件依賴，包括tkc,base,widget等庫(kù)#將所有編譯文件加入列表files = awtk.getWebFiles() + web_files + app_filesall_files = []for f in files:all_files.append(os.path.normpath(os.path.abspath(f)))# 將目標(biāo)項(xiàng)目的res加入編譯器的include選項(xiàng)# includes_path = -ID:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\resincludes_path = ' -I' + join_path(app_target_dir, 'res') + ' 'if 'includes' in config:includes_files = config['includes']for f in includes_files:includes_path += ('-I ' + f + " ")# 生成編譯flagCOMMON_FLAGS = ' ' + flags + ' 'if 'cflags' in config:COMMON_FLAGS = COMMON_FLAGS + ' ' + ' '.join(config['cflags'])if 'cxxflags' in config:COMMON_FLAGS = COMMON_FLAGS + ' ' + ' '.join(config['cxxflags'])COMMON_FLAGS = COMMON_FLAGS + ' -DSAFE_HEAP=1 -DASSERTIONS=1 -DSTACK_OVERFLOW_CHECK=1 'COMMON_FLAGS = COMMON_FLAGS + \' -s EXPORTED_RUNTIME_METHODS=@configs/export_runtime_funcs.json 'COMMON_FLAGS = COMMON_FLAGS + '-s ALLOW_MEMORY_GROWTH=1 -s USE_SDL=2'# 如果目標(biāo)項(xiàng)目是js類型將附加的編譯選項(xiàng)if(is_js_app(config)):COMMON_FLAGS = COMMON_FLAGS + ' -DAWTK_WEB_JS 'COMMON_FLAGS = COMMON_FLAGS + ' -s RESERVED_FUNCTION_POINTERS=1000 'COMMON_FLAGS = COMMON_FLAGS + ' -s EXPORTED_FUNCTIONS=@gen/export_all_funcs.json'COMMON_FLAGS = COMMON_FLAGS + ' -DWITH_DATA_READER_WRITER 'COMMON_FLAGS = COMMON_FLAGS + ' -DHAS_STD_MALLOC -DNDEBUG -DAWTK_WEB -Isrc/c 'COMMON_FLAGS = COMMON_FLAGS + ' -DWITH_WINDOW_ANIMATORS -DWITH_NANOVG_GPU '# COMMON_FLAGS = '  -g4 -gsource-map   -DSAFE_HEAP=1 -DASSERTIONS=1 -DSTACK_OVERFLOW_CHECK=1  -s EXPORTED_RUNTIME_METHODS=@configs/export_runtime_funcs.json -s ALLOW_MEMORY_GROWTH=1 -s USE_SDL=2 -s EXPORTED_FUNCTIONS=@gen/export_all_funcs.json -DWITH_DATA_READER_WRITER  -DHAS_STD_MALLOC -DNDEBUG -DAWTK_WEB -Isrc/c  -DWITH_WINDOW_ANIMATORS -DWITH_NANOVG_GPU '#輸出對(duì)應(yīng)的js文件
#output=D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\js\\awtk.jsoutput = join_path(config_get_js_dir(config), "awtk.js")CPPFLAGS_JS = ' -o ' + output + ' -s WASM=0 ' + COMMON_FLAGS + includes_pathawtk.runArgsInFile('emcc -v ', CPPFLAGS_JS, all_files)
#output=D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\js\\awtk_asm.jsoutput = join_path(config_get_js_dir(config), "awtk_asm.js")CPPFLAGS_ASM = ' -o ' + output + COMMON_FLAGS + includes_pathawtk.runArgsInFile('emcc -v ', CPPFLAGS_ASM, all_files)

運(yùn)行 awtk.runArgsInFile之后系統(tǒng)將輸出一大堆文件編譯，總共三百多個(gè)文件，耐心等待，日志看著一大坨很亂：

 -o D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\js\\awtk.js -s WASM=0   -g4 -gsource-map   -DSAFE_HEAP=1 -DASSERTIONS=1 -DSTACK_OVERFLOW_CHECK=1  -s EXPORTED_RUNTIME_METHODS=@configs/export_runtime_funcs.json -s ALLOW_MEMORY_GROWTH=1 -s USE_SDL=2 -s EXPORTED_FUNCTIONS=@gen/export_all_funcs.json -DWITH_DATA_READER_WRITER  -DHAS_STD_MALLOC -DNDEBUG -DAWTK_WEB -Isrc/c  -DWITH_WINDOW_ANIMATORS -DWITH_NANOVG_GPU  -ID:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\res  -ID:\\Devtools\\awtk/3rd -ID:\\Devtools\\awtk -ID:\\Devtools\\awtk\\src -ID:\\Devtools\\awtk\\src/ext_widgets D:\\Devtools\\awtk\\src\\tkc\\action_darray_thread.c D:\\Devtools\\awtk\\src\\tkc\\action_queue.c D:\\Devtools\\awtk\\src\\tkc\\action_thread.c ...(省略awtk庫(kù)的一堆c文件)
emcc: warning: please replace -g4 with -gsource-map [-Wdeprecated]
"D:/Devtools/emsdk/upstream/bin\clang.exe" -target wasm32-unknown-emscripten -fignore-exceptions -fvisibility=default -mllvm -combiner-global-alias-analysis=false -mllvm -enable-emscripten-sjlj -mllvm -disable-lsr --sysroot=D:\Devtools\emsdk\upstream\emscripten\cache\sysroot -DEMSCRIPTEN -Werror=implicit-function-declaration -isystem D:\Devtools\emsdk\upstream\emscripten\cache\sysroot\include\SDL2 -Xclang -iwithsysroot/include\compat -v -g3 -g -DSAFE_HEAP=1 -DASSERTIONS=1 -DSTACK_OVERFLOW_CHECK=1 -DWITH_DATA_READER_WRITER -DHAS_STD_MALLOC -DNDEBUG -DAWTK_WEB -Isrc/c -DWITH_WINDOW_ANIMATORS -DWITH_NANOVG_GPU -ID:\Devtools\awtk-web\webroot\AwtkApplication3\res -ID:\Devtools\awtk/3rd -ID:\Devtools\awtk -ID:\Devtools\awtk\src -ID:\Devtools\awtk\src/ext_widgets D:\Devtools\awtk\src\tkc\action_darray_thread.c -c -o C:\Users\nihaoa\AppData\Local\Temp\emscripten_temp_256cz5b6\action_darray_thread_0.o
clang version 19.0.0git (https:/github.com/llvm/llvm-project 6c7805d5d186a6d1263f90b8033ad85e2d2633d7)
Target: wasm32-unknown-emscripten
Thread model: posix
InstalledDir: D:\Devtools\emsdk\upstream\bin(in-process)"D:\\Devtools\\emsdk\\upstream\\bin\\clang.exe" -cc1 -triple wasm32-unknown-emscripten -emit-obj -mrelax-all -disable-free -clear-ast-before-backend -disable-llvm-verifier -discard-value-names -main-file-name action_darray_thread.c -mrelocation-model static -mframe-pointer=none -ffp-contract=on -fno-rounding-math -mconstructor-aliases -target-cpu generic -debug-info-kind=constructor -dwarf-version=4 -debugger-tuning=gdb "-fdebug-compilation-dir=D:\\Devtools\\awtk-web" -v "-fcoverage-compilation-dir=D:\\Devtools\\awtk-web" -resource-dir "D:\\Devtools\\emsdk\\upstream\\lib\\clang\\19" -isystem "D:\\Devtools\\emsdk\\upstream\\emscripten\\cache\\sysroot\\include\\SDL2" -D EMSCRIPTEN -D SAFE_HEAP=1 -D ASSERTIONS=1 -D STACK_OVERFLOW_CHECK=1 -D WITH_DATA_READER_WRITER -D HAS_STD_MALLOC -D NDEBUG -D AWTK_WEB -I src/c -D WITH_WINDOW_ANIMATORS -D WITH_NANOVG_GPU -I "D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\res" -I "D:\\Devtools\\awtk/3rd" -I "D:\\Devtools\\awtk" -I "D:\\Devtools\\awtk\\src" -I "D:\\Devtools\\awtk\\src/ext_widgets" -isysroot "D:\\Devtools\\emsdk\\upstream\\emscripten\\cache\\sysroot" -internal-isystem "D:\\Devtools\\emsdk\\upstream\\lib\\clang\\19\\include" -internal-isystem "D:\\Devtools\\emsdk\\upstream\\emscripten\\cache\\sysroot/include/wasm32-emscripten" -internal-isystem "D:\\Devtools\\emsdk\\upstream\\emscripten\\cache\\sysroot/include" -Werror=implicit-function-declaration -ferror-limit 19 -fmessage-length=230 -fvisibility=default -fgnuc-version=4.2.1 -fskip-odr-check-in-gmf -fignore-exceptions -fcolor-diagnostics "-iwithsysroot/include\\compat" -mllvm -combiner-global-alias-analysis=false -mllvm -enable-emscripten-sjlj -mllvm -disable-lsr -o "C:\\Users\\nihaoa\\AppData\\Local\\Temp\\emscripten_temp_256cz5b6\\action_darray_thread_0.o" -x c "D:\\Devtools\\awtk\\src\\tkc\\action_darray_thread.c"
clang -cc1 version 19.0.0git based upon LLVM 19.0.0git default target x86_64-pc-windows-msvc
ignoring nonexistent directory "D:\Devtools\emsdk\upstream\emscripten\cache\sysroot/include/wasm32-emscripten"
#include "..." search starts here:
#include <...> search starts here:src/cD:\Devtools\awtk-web\webroot\AwtkApplication3\resD:\Devtools\awtk/3rdD:\Devtools\awtkD:\Devtools\awtk\srcD:\Devtools\awtk\src/ext_widgetsD:\Devtools\emsdk\upstream\emscripten\cache\sysroot\include\SDL2D:\Devtools\emsdk\upstream\emscripten\cache\sysroot/include\compatD:\Devtools\emsdk\upstream\lib\clang\19\includeD:\Devtools\emsdk\upstream\emscripten\cache\sysroot/include
End of search list.
。。。(省略后面三百多個(gè)文件的編譯)"D:/Devtools/emsdk/upstream/bin\clang.exe" -target wasm32-unknown-emscripten -fignore-exceptions -fvisibility=default -mllvm -combiner-global-alias-analysis=false -mllvm -enable-emscripten-sjlj -mllvm -disable-lsr --sysroot=D:\Devtools\emsdk\upstream\emscripten\cache\sysroot -DEMSCRIPTEN -Werror=implicit-function-declaration -isystem D:\Devtools\emsdk\upstream\emscripten\cache\sysroot\include\SDL2 -Xclang -iwithsysroot/include\compat -v -g3 -g -DSAFE_HEAP=1 -DASSERTIONS=1 -DSTACK_OVERFLOW_CHECK=1 -DWITH_DATA_READER_WRITER -DHAS_STD_MALLOC -DNDEBUG -DAWTK_WEB -Isrc/c -DWITH_WINDOW_ANIMATORS -DWITH_NANOVG_GPU -ID:\Devtools\awtk-web\webroot\AwtkApplication3\res -ID:\Devtools\awtk/3rd -ID:\Devtools\awtk -ID:\Devtools\awtk\src -ID:\Devtools\awtk\src/ext_widgets D:\AWStudioProjects\Workspace\AwtkApplication3\src\main.c -c -o C:\Users\nihaoa\AppData\Local\Temp\emscripten_temp_vom058uh\main_313.o
clang version 19.0.0git (https:/github.com/llvm/llvm-project 6c7805d5d186a6d1263f90b8033ad85e2d2633d7)
Target: wasm32-unknown-emscripten
Thread model: posix
InstalledDir: D:\Devtools\emsdk\upstream\bin(in-process)"D:\\Devtools\\emsdk\\upstream\\bin\\clang.exe" -cc1 -triple wasm32-unknown-emscripten -emit-obj -mrelax-all -disable-free -clear-ast-before-backend -disable-llvm-verifier -discard-value-names -main-file-name main.c -mrelocation-model static -mframe-pointer=none -ffp-contract=on -fno-rounding-math -mconstructor-aliases -target-cpu generic -debug-info-kind=constructor -dwarf-version=4 -debugger-tuning=gdb "-fdebug-compilation-dir=D:\\Devtools\\awtk-web" -v "-fcoverage-compilation-dir=D:\\Devtools\\awtk-web" -resource-dir "D:\\Devtools\\emsdk\\upstream\\lib\\clang\\19" -isystem "D:\\Devtools\\emsdk\\upstream\\emscripten\\cache\\sysroot\\include\\SDL2" -D EMSCRIPTEN -D SAFE_HEAP=1 -D ASSERTIONS=1 -D STACK_OVERFLOW_CHECK=1 -D WITH_DATA_READER_WRITER -D HAS_STD_MALLOC -D NDEBUG -D AWTK_WEB -I src/c -D WITH_WINDOW_ANIMATORS -D WITH_NANOVG_GPU -I "D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\res" -I "D:\\Devtools\\awtk/3rd" -I "D:\\Devtools\\awtk" -I "D:\\Devtools\\awtk\\src" -I "D:\\Devtools\\awtk\\src/ext_widgets" -isysroot "D:\\Devtools\\emsdk\\upstream\\emscripten\\cache\\sysroot" -internal-isystem "D:\\Devtools\\emsdk\\upstream\\lib\\clang\\19\\include" -internal-isystem "D:\\Devtools\\emsdk\\upstream\\emscripten\\cache\\sysroot/include/wasm32-emscripten" -internal-isystem "D:\\Devtools\\emsdk\\upstream\\emscripten\\cache\\sysroot/include" -Werror=implicit-function-declaration -ferror-limit 19 -fmessage-length=230 -fvisibility=default -fgnuc-version=4.2.1 -fskip-odr-check-in-gmf -fignore-exceptions -fcolor-diagnostics "-iwithsysroot/include\\compat" -mllvm -combiner-global-alias-analysis=false -mllvm -enable-emscripten-sjlj -mllvm -disable-lsr -o "C:\\Users\\nihaoa\\AppData\\Local\\Temp\\emscripten_temp_vom058uh\\main_313.o" -x c "D:\\AWStudioProjects\\Workspace\\AwtkApplication3\\src\\main.c"
clang -cc1 version 19.0.0git based upon LLVM 19.0.0git default target x86_64-pc-windows-msvc
ignoring nonexistent directory "D:\Devtools\emsdk\upstream\emscripten\cache\sysroot/include/wasm32-emscripten"
#include "..." search starts here:
#include <...> search starts here:src/cD:\Devtools\awtk-web\webroot\AwtkApplication3\resD:\Devtools\awtk/3rdD:\Devtools\awtkD:\Devtools\awtk\srcD:\Devtools\awtk\src/ext_widgetsD:\Devtools\emsdk\upstream\emscripten\cache\sysroot\include\SDL2D:\Devtools\emsdk\upstream\emscripten\cache\sysroot/include\compatD:\Devtools\emsdk\upstream\lib\clang\19\includeD:\Devtools\emsdk\upstream\emscripten\cache\sysroot/include
End of search list.
"D:/Devtools/emsdk/upstream/bin\clang.exe" --version
"D:/Devtools/emsdk/upstream/bin\wasm-ld.exe" @C:\Users\nihaoa\AppData\Local\Temp\emscripten_e9gcm659.rsp.utf-8
"D:\Devtools\emsdk\python\3.9.2-nuget_64bit\python.exe" -E D:\Devtools\emsdk\upstream\emscripten\tools\wasm-sourcemap.py D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm --dwarfdump=D:/Devtools/emsdk/upstream/bin\llvm-dwarfdump.exe -o D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm.map --basepath=D:\Devtools\awtk-web\webroot\AwtkApplication3\js"D:/Devtools/emsdk/upstream/bin\llvm-objcopy.exe" D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm --remove-section=.debug* --remove-section=producers"D:/Devtools/emsdk/upstream\bin\wasm-emscripten-finalize" -g --dyncalls-i64 --pass-arg=legalize-js-interface-exported-helpers --dwarf --output-source-map-url=awtk_asm.wasm.map D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm -o D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm --detect-features --input-source-map=D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm.map --output-source-map=D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm.map
emcc: warning: `main` is defined in the input files, but `_main` is not in `EXPORTED_FUNCTIONS`. Add it to this list if you want `main` to run. [-Wunused-main]"D:/Devtools/emsdk/node/16.20.0_64bit/bin/node.exe" D:\Devtools\emsdk\upstream\emscripten\src\compiler.mjs C:\Users\nihaoa\AppData\Local\Temp\tmpwpa968vp.json

awtk.runArgsInFile源代碼：

def getIncludes():return '-I' + AWTK_ROOT_DIR + '/3rd ' + '-I' + AWTK_ROOT_DIR + ' -I' + AWTK_SRC_DIR +' -I' + AWTK_SRC_DIR +'/ext_widgets';def writeArgs(filename, str):with open(filename, "w") as text_file:text_file.write(str);def runArgsInFile(cmd, flags, files):cmd_args = flags + ' ' + getIncludes() + ' ' + ' '.join(files) cmd_args = cmd_args.replace('\\', '\\\\');writeArgs("args.txt", cmd_args);print(cmd_args)os.system(cmd + ' @args.txt');

該步完成后會(huì)發(fā)現(xiàn)映像項(xiàng)目有一個(gè)js目錄，多了3個(gè)文件：

PS D:\Devtools\awtk-web\webroot\AwtkApplication3\js> ls目錄: D:\Devtools\awtk-web\webroot\AwtkApplication3\jsMode                 LastWriteTime         Length Name
----                 -------------         ------ ----
-a----         2024/5/28     17:05          82504 awtk_asm.js
-a----         2024/5/28     17:05        2226706 awtk_asm.wasm
-a----         2024/5/28     17:05         684260 awtk_asm.wasm.map

是以下指令生成的：

"D:/Devtools/emsdk/upstream/bin\wasm-ld.exe" 		@C:\Users\nihaoa\AppData\Local\Temp\emscripten_e9gcm659.rsp.utf-8"D:\Devtools\emsdk\python\3.9.2-nuget_64bit\python.exe" 
-E D:\Devtools\emsdk\upstream\emscripten\tools\wasm-sourcemap.py D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm --dwarfdump=D:/Devtools/emsdk/upstream/bin\llvm-dwarfdump.exe 
-o D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm.map 
--basepath=D:\Devtools\awtk-web\webroot\AwtkApplication3\js"D:/Devtools/emsdk/upstream/bin\llvm-objcopy.exe" 
D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm 
D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm 
--remove-section=.debug* 
--remove-section=producers"D:/Devtools/emsdk/upstream\bin\wasm-emscripten-finalize" -g --dyncalls-i64 --pass-arg=legalize-js-interface-exported-helpers --dwarf --output-source-map-url=awtk_asm.wasm.map D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm-o D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm --detect-features --input-source-map=D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm.map --output-source-map=D:\Devtools\awtk-web\webroot\AwtkApplication3\js\awtk_asm.wasm.mapemcc: warning: `main` is defined in the input files, but `_main` is not in `EXPORTED_FUNCTIONS`. Add it to this list if you want `main` to run. [-Wunused-main]"D:/Devtools/emsdk/node/16.20.0_64bit/bin/node.exe" D:\Devtools\emsdk\upstream\emscripten\src\compiler.mjs C:\Users\nihaoa\AppData\Local\Temp\tmpwpa968vp.json

3.build_awtk_web_js：為映像構(gòu)建app.js和awtk_web.js

def build_awtk_web_js(config):# 生成目標(biāo)項(xiàng)目webroot的app.js[本質(zhì)是把原項(xiàng)目的源js文件所有內(nèi)容暴力整合到一個(gè)js文件下]build_app_js(config)"""app_target_dir= 'D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3'assets_js= 'D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\assets_web.js'outfile = 'D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\js\\awtk_web.js'"""app_target_dir = config_get_app_target_dir(config)assets_js = join_path(app_target_dir, 'assets_web.js')outfile = join_path(config_get_js_dir(config), 'awtk_web.js')# 在awtk-web目錄下生成app_config.js文件，與assets_web.js和下列js文件用于構(gòu)建awtk_web.jsgen_app_config(config, 'gen/app_config.js')awtk_web_js_files = [assets_js,'src/js/browser.js','gen/app_config.js','src/js/webgl2d.js','src/js/image_cache.js','src/js/assets_manager.js','src/js/image_loader.js','src/js/input_method_web.js','src/js/utils.js','src/js/edit_element.js','src/js/vgcanvas_web.js','src/js/awtk_wrap.js','src/js/key_event.js','src/js/events_source.js','src/js/main_loop_web.js']merge_files(awtk_web_js_files, outfile)

def merge_files(srcs, dst):print(dst)with open(dst, 'w') as outfile:for fname in srcs:print(fname)with open(fname, encoding='utf-8-sig') as infile:outfile.write(infile.read())outfile.write("\n")def need_awtk_api_js(config):return is_js_app(config) and not is_reactjs(config)#將目標(biāo)項(xiàng)目build.json下source選項(xiàng)指定的js文件合成一個(gè)新的app.js文件，放到webroot對(duì)應(yīng)映像下
def build_app_js(config):app_files = []sources = config['sources']#output='D:\\Devtools\\awtk-web\\webroot\\AwtkApplication3\\js\\app.js'output = join_path(config_get_js_dir(config), 'app.js')#對(duì)于js類型項(xiàng)目須加入兩個(gè)js文件if(need_awtk_api_js(config)):app_files.append('api/awtk_api_browser_prefix.js')app_files.append('api/awtk_api.js')#如果目標(biāo)項(xiàng)目下有js文件，加入app_files列表for f in sources:if f.endswith('.js'):app_files = app_files + glob.glob(join_path(app_root, f))#app_files下所有js文件內(nèi)容合并到app.jsmerge_files(app_files, output)print(app_files, output)

該步完成后映像項(xiàng)目下js目錄將多出app.js和awtk_web.js兩個(gè)文件：

PS D:\Devtools\awtk-web\webroot\AwtkApplication3\js> ls目錄: D:\Devtools\awtk-web\webroot\AwtkApplication3\jsMode                 LastWriteTime         Length Name
----                 -------------         ------ ----
-a----         2024/5/28     17:11              0 app.js
-a----         2024/5/28     17:05          82504 awtk_asm.js
-a----         2024/5/28     17:05        2226706 awtk_asm.wasm
-a----         2024/5/28     17:05         684260 awtk_asm.wasm.map
-a----         2024/5/28     17:11         140526 awtk_web.js

自此編譯過(guò)程結(jié)束。

上面的例子是awtk c項(xiàng)目，如果是js項(xiàng)目，編譯列表會(huì)略有變化，具體自己實(shí)驗(yàn)。