Electron 打包canvas总结

最近有项目需要用到画布，且是跨平台的应用，选用了https://github.com/Automattic/node-canvas

打包过程遇到了各种麻烦，开发电脑没有问题，未装开发环境的电脑普遍白屏，详查才知道是动态链接库的问题。

出现问题得解决啊，于是乎有以下几种思路。

让canvas静态编译，参考：https://blog.csdn.net/lihangxiaoji/article/details/81297342

无奈条路没有走通。

将依赖的动态库打包到.app中，修正模块的依赖路径解决。

用第二种虽然花费大量精力，但至少出来结果了。
修改编译后的canvas.node的依赖路径：


#!/bin/sh

PRODUCT_PATH=./node_modules
INSTALL_PATH=/usr/local/opt
LOAD_PATH=@rpath/../dylib

PRODUCT_NAME=$PRODUCT_PATH/canvas/build/Release/canvas.node

install_name_tool -change "$INSTALL_PATH/pixman/lib/libpixman-1.0.dylib" "$LOAD_PATH/libpixman-1.0.dylib" "$PRODUCT_NAME"
install_name_tool -change "$INSTALL_PATH/cairo/lib/libcairo.2.dylib" "$LOAD_PATH/libcairo.2.dylib" "$PRODUCT_NAME"

install_name_tool -change "$INSTALL_PATH/glib/lib/libgobject-2.0.0.dylib" "$LOAD_PATH/libgobject-2.0.0.dylib" "$PRODUCT_NAME"
install_name_tool -change "$INSTALL_PATH/libffi/lib/libffi.6.dylib" "$LOAD_PATH/libffi.6.dylib" "$PRODUCT_NAME"

以上参数根据实际情况修改。

还有，子模块的依赖也是需要修改的。如：


PRODUCT_NAME=$PRODUCT_PATH/libcroco-0.6.3.dylib
install_name_tool -change "$INSTALL_PATH/glib/lib/libglib-2.0.0.dylib" "$LOAD_PATH/libglib-2.0.0.dylib" "$PRODUCT_NAME" 
install_name_tool -change "$INSTALL_PATH/gettext/lib/libintl.8.dylib" "$LOAD_PATH/libintl.8.dylib" "$PRODUCT_NAME" 

PRODUCT_NAME=$PRODUCT_PATH/libharfbuzz.0.dylib
install_name_tool -change "$INSTALL_PATH/glib/lib/libglib-2.0.0.dylib" "$LOAD_PATH/libglib-2.0.0.dylib" "$PRODUCT_NAME" 
install_name_tool -change "$INSTALL_PATH/gettext/lib/libintl.8.dylib" "$LOAD_PATH/libintl.8.dylib" "$PRODUCT_NAME" 
install_name_tool -change "$INSTALL_PATH/freetype/lib/libfreetype.6.dylib" "$LOAD_PATH/libfreetype.6.dylib" "$PRODUCT_NAME" 
install_name_tool -change "$INSTALL_PATH/graphite2/lib/libgraphite2.3.dylib" "$LOAD_PATH/libgraphite2.3.dylib" "$PRODUCT_NAME"

Electron 打包canvas总结

推荐阅读更多精彩内容