TRTC Electron SDK: Mac 下构建双架构包

2022-09-23 14:30:42 浏览数 (1)

TRTC Electron SDK 从 10.6.403 版本开始，支持构建 X64 和 ARM64 双架构包

构建双架构包，需要用到 electron-builder 的 --universal 命令行参数。

术语说明

  • 单架构包：指构建的应用程序包，只能运行 X64 或者 ARM64 指令集，在不匹配的硬件上不能运行。例如，在 Mac M1 芯片机器上构建的 ARM64 指令集应用程序，不能在 Mac Intel CPU的设备上运行。

注意：X64 的应用安装包可以在 Mac M1 芯片的机器上运行，是因为 Mac 系统做了兼容，实际运行的是 X64 指令，相比执行 ARM64 指令，性能较差。另外，TRTC Electron SDK 默认使用硬件完成音视频编解码，在硬件不支持或处理能力不足时，会在软件层进程音视频编解码，此时在 M1（ARM64架构）芯片上执行 X64 指令，性能会差很多。

  • 双架构包：指构建的应用程序包，能够同时运行 X64 和 ARM64 指令集，在 Intel CPU 上执行 X64 指令，在 Mac M1 芯片上执行 ARM64 指令。

Webpack 构建

1. 详细配置，可参考开源 教育 App

GitHub - TencentCloud/trtc-education-electron: 教育场景化解决方案App，包含基础的实时音视频通信和即时通信功能，支持丰富的课堂互动（举手、点名/签到等）和教育白板。 技术栈：Electron、React、Material-ui react、Webpack、sass等。

2.electron-builder 配置

以下代码并不完整，仅显示 Mac 双架构打包的关键配置。

代码文件：package.json

代码语言：txt复制
{
"build": {
    "asar": true,
    "asarUnpack": "**\*.{node,dll}",
    "files": [
      "!node_modules/trtc-electron-sdk/build/mac-framework"
    ],
    "mac": {
      "extraFiles": [
        {
          "from": "node_modules/trtc-electron-sdk/build/Release/${arch}/trtc_electron_sdk.node",
          "to": "./Resources"
        },
        {
          "from": "node_modules/trtc-electron-sdk/build/mac-framework/${arch}/",
          "to": "./Frameworks"
        }
      ],
      "target": [
        "dmg"
      ]
    },
    "win": {
       ...
    }
  }
}

配置说明：

  • "asarUnpack": "*__.{node,dll}" --该配置将 二进制 执行文件构建在 app.asar 之外，否则，会导致 .node 文件合并报错。
  • "!node_modules/trtc-electron-sdk/build/mac-framework" -- 打包时，files 配置项中需要排除这个文件，再通过 extraFiles 配置进去，避免打包时 electron-builder 报错。推荐使用 electron-builder@23 版本，低版本打包可能存在 python 或者 node.js spawn 报错。
  • extraFiles 中 trtc_electron_sdk.node 文件配置 -- 需要与 native-ext-loader 配置结合使用，注意路径要保持一致。此处配置是与 asarUnpack 配置一起使用才能构建双架构包的。
  • extraFiles 中 trtc-electron-sdk/build/mac-framework -- 这个配置是为了合入两个音视频编解码相关的二进制文件，独立拆分是为了满足 Mac 应用合规要求。

3. native-ext-loader 配置，加载 .node 文件

以下代码并不完整，仅显示 Mac 双架构打包的关键配置。

代码文件：./.erb/configs/webpack.config.base.js

注意 .node 文件加载路径相关的配置和代码，需要与 electron-builder 中的配置保持一致，否则会导致构建或者运行时失败。

代码语言：txt复制
// 此处的路径，需要与 package.json 中 electron-builder 配置中 .node 文件夹在路径一只
const getRewritePath = function() {
  console.log('getRewritePath:', process.env.NODE_ENV);
  let rewritePathString = '';
  if (process.env.NODE_ENV === 'production') {
    rewritePathString = targetPlatform === 'win32' ? './resources' : '../Resources';
  } else if (process.env.NODE_ENV === 'development') {
    rewritePathString = 'node_modules/trtc-electron-sdk/build/Release';
  }
  return rewritePathString;
};

export default {
  externals: [...Object.keys(externals || {})],

  module: {
    rules: [
      { test: /.node$/, loader: 'native-ext-loader', options: { rewritePath: getRewritePath() } },
      {
        test: /.[jt]sx?$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
          options: {
            cacheDirectory: true,
          },
        },
      },
    ],
  },
};

4. 打包命令

文件路径：package.json

代码语言：txt复制
{
    "scripts": {
    ...
    "package": "node -r @babel/register ./.erb/scripts/clean.js dist release && yarn build && electron-builder build --publish never",
    "package:mac-universal": "node -r @babel/register ./.erb/scripts/clean.js dist release && yarn build && electron-builder build  --mac --universal --publish never",
   ...
  },
}

在 Mac 设备上，执行 npm run package 或 yarn package 可以构建单架构包，执行 npm run package:mac-universal 或者 yarm package:mac-universal 可够构建双架构包，具体使用 npm 还是 yarn 执行命令，依赖工程自身情况，我们开源的教育 demo 需要使用 yarn。

注意命令中的 “--universal” 参数。

Vite 构建

1. 详细配置，可参考开源 会议 App (TUIRoom)

https://github.com/tencentyun/TUIRoom/tree/main/Electron

2. electron-builder 配置

以下代码并不完整，仅显示 Mac 双架构打包的关键配置。

代码文件：electron-builder.json5

代码语言：txt复制
{
  "asar": true,
  "asarUnpack": "**\*.{node,dll}",
  "directories": {
    "output": "release/${version}"
  },
  "files": [
    "dist",
    "!node_modules/trtc-electron-sdk/build/mac-framework"
  ],
  "mac": {
    "extraFiles": [
      {
        "from": "node_modules/trtc-electron-sdk/build/Release/${arch}/trtc_electron_sdk.node",
        "to": "./Resources/app.asar.unpacked/node_modules/trtc-electron-sdk/build/Release"
      },
      {
        "from": "node_modules/trtc-electron-sdk/build/mac-framework/${arch}/",
        "to": "./Frameworks"
      }
    ],
    "target": [
      "dmg"
    ],
  }
}

配置说明：

  • "asarUnpack": "*__.{node,dll}" --该配置将 二进制 执行文件构建在 app.asar 之外，否则，会导致 .node 文件合并报错。
  • "!node_modules/trtc-electron-sdk/build/mac-framework" -- 打包时，files 配置项中需要排除这个文件，再通过 extraFiles 配置进去，避免打包时 electron-builder 报错。推荐使用 electron-builder@23 版本，低版本打包可能存在 python 或者 node.js spawn 报错。
  • extraFiles 中 trtc_electron_sdk.node 文件配置 -- 此处配置是与 asarUnpack 配置一起使用才能构建双架构包的。
  • extraFiles 中 trtc-electron-sdk/build/mac-framework -- 这个配置是为了合入两个音视频编解码相关的二进制文件，独立拆分是为了满足 Mac 应用合规要求。

3. 打包命令

文件路径：package.json

代码语言：txt复制
...
"scripts": {
    "prebuild": "node scripts/build.mjs",
    "build": "electron-builder",
    "build:mac-universal": "npm run prebuild && electron-builder build --mac --universal",
    ...
},
...

在 Mac 设备上，执行 npm run build 可以构建单架构包，执行 npm run build:mac-universal 可够构建双架构包。

注意命令中的 “--universal” 参数。

实时音视频 electron macos

0 人点赞