由于 Qt 和 QtWebKit 配置问题，Node 项目无法构建

编程问答 2022-05-23

问题描述

我正在尝试构建一个依赖于 QT 和 QtWebkit & QtWebKitWidgets 的节点项目。

环境信息：

  • 操作系统：Ubuntu 20.04
  • Node JS 版本：v9.6.1
  • npm 版本：5.6.0
  • Qt - >Qt 5.9.9（自定义安装，包括以下选项）
  • Qt 5.9.9 -> 桌面 gcc 64 位
  • Qt 5.9.9 -> Qt 网络授权
  • Qt 5.9.9 -> Qt 脚本（已弃用）
  • qtwebkit 版本：5.212

当我运行 npm install 命令时，项目构建失败并显示以下错误：

> company-bro[email protected] install /home/rando/Desktop/git/master-node/node/browser_engines/src/browsers/webkit
> node-gyp rebuild

make: Entering directory '/home/rando/Desktop/git/master-node/node/browser_engines/src/browsers/webkit/build'
  CXX(target) Release/obj.target/nodekit/native/nodekit.o
In file included from ../native/lib/webpageapiwrap.h:9,from ../native/qt_v8.h:42,from ../native/instancemap.cc:7,from ../native/nodekit.cc:19:
../deps/webkit_static_lib/webkit_static_lib/webpageapi.h:4:10: Fatal error: QWebPage: No such file or directory
    4 | #include <QWebPage>
      |          ^~~~~~~~~~
compilation terminated.
make: *** [nodekit.target.mk:159: Release/obj.target/nodekit/native/nodekit.o] Error 1
make: Leaving directory '/home/rando/Desktop/git/master-node/node/browser_engines/src/browsers/webkit/build'
gyp ERR! build error 
gyp ERR! stack Error: `make` Failed with exit code: 2
gyp ERR! stack     at ChildProcess.onExit (/home/rando/.nvm/versions/node/v9.6.1/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:258:23)
gyp ERR! stack     at ChildProcess.emit (events.js:127:13)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:209:12)
gyp ERR! System Linux 5.8.0-44-generic
gyp ERR! command "/home/rando/.nvm/versions/node/v9.6.1/bin/node" "/home/rando/.nvm/versions/node/v9.6.1/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
gyp ERR! cwd /home/rando/Desktop/git/master-node/node/browser_engines/src/browsers/webkit
gyp ERR! node -v v9.6.1
gyp ERR! node-gyp -v v3.6.2
gyp ERR! not ok 
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! dexi-bro[email protected] install: `node-gyp rebuild`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the dexi-bro[email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/rando/.npm/_logs/2021-03-03T10_27_38_117Z-debug.log
rando@rando-dexi:~/Desktop/git/master-node/node/browser_engines/src/browsers/webkit$ npm install 

> dexi-bro[email protected] install /home/rando/Desktop/git/master-node/node/browser_engines/src/browsers/webkit
> node-gyp rebuild

make: Entering directory '/home/rando/Desktop/git/master-node/node/browser_engines/src/browsers/webkit/build'
  CXX(target) Release/obj.target/nodekit/native/nodekit.o
In file included from ../native/lib/webpageapiwrap.h:9,from ../native/nodekit.cc:19:
../deps/webkit_static_lib/webkit_static_lib/webpageapi.h:4:10: Fatal error: QWebPage: No such file or directory
    4 | #include <QWebPage>
      |          ^~~~~~~~~~
compilation terminated.
make: *** [nodekit.target.mk:159: Release/obj.target/nodekit/native/nodekit.o] Error 1
make: Leaving directory '/home/rando/Desktop/git/master-node/node/browser_engines/src/browsers/webkit/build'
gyp ERR! build error 
gyp ERR! stack Error: `make` Failed with exit code: 2
gyp ERR! stack     at ChildProcess.onExit (/home/rando/.nvm/versions/node/v9.6.1/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:258:23)
gyp ERR! stack     at ChildProcess.emit (events.js:127:13)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:209:12)
gyp ERR! System Linux 5.8.0-44-generic
gyp ERR! command "/home/rando/.nvm/versions/node/v9.6.1/bin/node" "/home/rando/.nvm/versions/node/v9.6.1/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
gyp ERR! cwd /home/rando/Desktop/git/master-node/node/browser_engines/src/browsers/webkit
gyp ERR! node -v v9.6.1
gyp ERR! node-gyp -v v3.6.2
gyp ERR! not ok 
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! dexi-bro[email protected] install: `node-gyp rebuild`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the dexi-bro[email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:

通过搜索网络，我得出的结论是，此错误是因为节点项目依赖于 company-bro[email protected] 包未找到 QtWebKit 和 QtWebKitWidgets 扩展并且无法构建。

在 Qt 安装文件夹中，QtWebKit 和 QtWebKitWidgets 存在于包含文件夹中。我应该怎么做才能从包中识别这些 QtWebKit 和 QtWebKitWidgets？

enter image description here

解决方法

这个问题是因为Libs和Cflags的错误路径没有指向正确的安装文件夹。

我通过进入目录解决了这个问题：${QT_HOME}/gcc_64/lib/pkgconfig 目录并通过添加如下描述修改了文件（Qt5WebKit.pc、Qt5WebKitWidgets.pc）：

  • Qt5WebKit.pc
#Before 
Libs: -L/home/qt/work/install/lib -lQt5WebKit
Cflags: -I/home/qt/work/install/include/Qt5WebKit 

#After 
Libs: -L${libdir} -lQt5WebKit
Cflags: -I${includedir}/QtWebKit  -I${includedir}
  • Qt5WebKitWidgets.pc
#Before
Libs: -L/home/qt/work/install/lib -lQt5WebKitWidgets
Cflags: -I/home/qt/work/install/include/Qt5WebKitWidgets 

#After
Libs: -L${libdir} -lQt5WebKitWidgets
Cflags: -I${includedir}/QtWebKitWidgets  -I${includedir}
npmnpmqtqtwebkitubuntu