二、音视频相关问题如何解决？
请单击 音视频通话 > 常见问题 查看解决方案。
三、我只想集成聊天窗口，如何单独集成 TUIChat？如果直接打开指定单聊/群聊会话？
独立集成聊天窗口，请参见 TUIChat 独立集成方案。
四、js 工程如何接入 TUIKit 组件?
TUIKit 仅支持 ts 环境运行，你可以通过渐进式配置 typescript 来使你项目中已有的 js 代码 与 TUIKit 中 ts 代码共存。
vue-clivite请在你 vue-cli 脚手架创建的工程根目录执行：vue add typescript之后按照如下配置项进行选择（为了保证能同时支持原有 js 代码 与 TUIKit 中 ts 代码，请你务必严格按照以下五个选项进行配置）注意：完成以上步骤后，请重新运行项目！请在你 vite 创建的工程根目录执行：npm install -D typescript
五、什么是 UserSig？如何生成 UserSig？
UserSig 是用户登录即时通信 IM 的密码，其本质是对 UserID 等信息加密后得到的密文。
UserSig 签发方式是将 UserSig 的计算代码集成到你的服务端，并提供面向项目的接口，在需要 UserSig 时由你的项目向业务服务器发起请求获取动态 UserSig。更多详情请参见 服务端生成 UserSig。
注意：这篇示例代码采用的获取 UserSig 的方案是在客户端代码中配置 SECRETKEY，该方法中 SECRETKEY 很容易被反编译逆向破解，一旦你的密钥泄露，攻击者就可以盗用你的腾讯云流量，因此该方法仅适合本地跑通功能调试。 正确的 UserSig 签发方式请参见上文。
六、运行时报错："TypeError: Cannot read properties of undefined (reading "getFriendList")"
若按照上述步骤接入后，运行时出现以下错误，请你务必删除 TUIKit 目录下的 node_modules 目录，以保证 TUIKit 的依赖唯一性，避免 TUIKit 多份依赖造成问题。
七、运行时报错：/chat-example/src/TUIKit/components/TUIChat /message-input/message-input-editor.vue .ts（8，23）TS1005: expected.
出现以上报错信息，是因为你安装的 @vue/cli 版本过低导致，请你务必保证你的 @vue/cli 版本在 5.0.0 及以上。升级方式如下：
npm install -g @vue/cli@5.0.8
八、运行时报错: Failed to resolve loader: sass-loader
出现以上报错信息，是因为你未安装 Sass 环境导致，请执行以下命令进行 Sass环境安装:
npm i -D sass@1.32.13 sass-loader@10.1.1
九、ESLint 报错：error 'withDefaults' is not defined no-undef? 'defineProps' is not defined no-undef? 以及 ESLint 其他报错？
若 chat-uikit-vue 拷贝到 src 目录下与你本地项目代码风格不一致导致报错，可将本组件目录屏蔽，如在项目根目录增加 .eslintignore 文件：
# .eslintignoresrc/TUIKit
十、vue/cli 如何关闭 dev 模式下，webpack 全屏 overlay error 报错信息提示？
可以在你项目根目录的 vue.config.js 中进行关闭：
webpack4webpack3module.exports = defineConfig({ … devServer: { client: { overlay: false, }, },});module.exports = { … devServer: { overlay: false, },};
十一、出现 Component name "XXXX" should always be multi-word 怎么办？
·IM TUIKit web 所使用的 ESLint 版本为 v6.7.2 ，对于模块名的驼峰式格式并不进行严格校验。
·如果你出现此问题，你可以在 .eslintrc.js 文件中进行如下配置：
module.exports = { … rules: { … 'vue/multi-word-component-names': 'warn', }, };
十二、出现 ERESOLVE unable to resolve dependency tree 怎么办？
npm install 的时候如果出现 ERESOLVE unable to resolve dependency tree ，表示依赖安装冲突，可采用以下方式进行安装：
npm install –legacy-peer-deps
十三、运行报错如下'vue packages version mismatch',如何解决？
·如果你是 vue2.7 项目，请在你项目根目录执行：
npm i vue@2.7.9 vue-template-compiler@2.7.9
·如果你是 vue2.6 项目，请在你项目根目录执行：
npm i vue@2.6.14 vue-template-compiler@2.6.14
十四、vite 项目 npm run build 之后 ts 报错?
原因：package.json script 下 "build": "vue-tsc && vite build" 中的 vue-tsc 命令导致。
解决方案: 删除 vue-tsc 即可。 "build": "vite build"
十五、使用 pnpm 下载缺少依赖?
pnpm 安装 @tencentcloud/chat-uikit-vue 后拷贝到 TUIKit 目录使用会存在内部依赖缺失问题，建议你优先选择 npm / yarn 方式安装。
若你确实需要使用 pnpm 安装依赖，请在进行完上文接入步骤后：
1. 将 node_modules/@tencentcloud/chat-uikit-vue/package.json 中的依赖项拷贝到你自身项目根目录 package.json 中。
2. 运行 pnpm i ， 进行内部缺失依赖安装。
十六、H5 页面 iOS 低版本机型出现白屏?
你可以通过配置 polyfill 兼容低机型版本。（什么是 polyfill？polyfill 是一种用于解决浏览器兼容问题的技术。它用于模拟某些浏览器不支持的新特性，使得这些特性能在不支持的浏览器中正常工作。更多详情请参见 babel-polyfill。）
1. 安装 babel-polyfill：
npm i @babel/polyfill
2. 入口文件引入 'babel-polyfill'：
import 'babel-polyfill';
3. 在项目根目录下新增 babel.config.js：
module.exports = { presets: [ [ '@vue/cli-plugin-babel/preset', { useBuiltIns: 'entry', corejs: 3, }, ], [ '@babel/preset-env', { targets: { browsers: ['iOS >= 11'], }, useBuiltIns: 'entry', corejs: 3, }, ], ],};
十七、运行报错：Uncaught TypeError: marked__WEBPACK_IMPORTED_MODULE_0_ Marked is not a constructor，如何处理？
如果你运行过程中出现如下错误，说明你当前 Vue CLI构建的项目环境版本较低，需要升级 uikit 中使用的 marked 版本至 5.1.2。
请在你项目的根目录使用以下脚本升级 marked 版本：
npm i marked@5.1.2 –legacy-peer-deps
十八、编译报错 node_modules/marked/lib/marked.esm.js: Class private methods are not enabled，如何处理？
如果你运行过程中出现如下错误，说明你当前使用的 marked 版本过低，请升级 marked 版本至 6.0.0。
请在你项目的根目录使用以下脚本升级 marked 版本：
npm i marked@6.0.0 –legacy-peer-deps
十九、运行报错 Uncaught SyntaxError: The requested module xxx does not provide an export named 'Friend'
如果你的 vite 项目运行过程中出现以下报错，请参见以下方案：
在根目录文件 tsconfig.json 下增加以下编译规则，分为以下两种情况：
1. 如果你的 tsconfig.json 没有 references 配置，直接在 tsconfig.json 中配置如下规则：
typescript ≥ 5.0.0typescript < 5.0.0{ … "compilerOptions": { … "verbatimModuleSyntax": false, }}{ … "compilerOptions": { … "importsNotUsedAsValues": "preserve", }}
2. 如果你的 tsconfig.json 已有 references 配置，例如 vite 自动配置的 "./tsconfig.app.json"，"./tsconfig.node.json" 等，由于 references 的特性，导致 tsconfig.json 本身只是规则的引用文件，此时直接在 tsconfig.json 中配置以下规则无效。需要将规则添加至实际的references对应的文件中。以下是具体示例：
| 错误写法 | 正确写法 |
| 当 tsconfig.json 文件中已有 references 相关配置时，直接在 tsconfig.json 中声明以下规则无效 | 当 tsconfig.json 文件中已有 references 相关配置时，需要在对应的 references 内部文件中声明以下规则。下文中是在 references 中配置的根目录 tsconfig.app.json 文件中配置以下规则。 |
| | |
修改后重新运行可以观察浏览器是否还有上述报错。
20、编译后 Sass waring：Deprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
如果你在运行后出现如下提示，请不要担心，这是 sass 大版本规则更新后的 warning 提示；该提醒并不会影响你的正常运行。
如果你想去除此类 warning 提示，请将 sass 版本降级至 1.77.4 及以下。
npm i -D sass@1.77.0 sass-loader@10.1.1
22、Vue2 & Vue3 UIKit 相关：
·集成音视频通话
·chat-uikit-vue npm
·Vue2 Demo源码及跑通示例
·Vue3 Demo源码及跑通示例
23、Vue2 & Vue3 UIKit 逻辑层: engine 相关
·chat-uikit-engine npm 仓库
·chat-uikit-engine 接口文档