常见问题

# 浏览器运行相关

# 1、浏览器内核版本问题

请您在调试和运行 web 程序时，尽量选择最新版本的 谷歌浏览器 chrome，或者在选择 360 浏览器、qq 浏览器等国产的浏览器时，确认其 Chrome 内核为最新的。 否则可能会出现形如下面的错误：

Uncaught SyntaxError: Unexpected reserved word

# 2、Vue warn <Suspense> 组件异步问题

若您在调试和运行 web 程序时，浏览器白屏或者出现如下告警:

[Vue warn]: Component <Anonymous>: setup function returned a promise,
but no <Suspense> boundary was found in the parent component tree.
A component with async setup() must be nested in a <Suspense> in order to be rendered.

如警告的描述，在异步组件外，缺少<Suspense> 组件的包裹。vue3 的官方描述请移步：点击详情open in new window
在 vue3.x 的 <script setup> 语法糖中，需要做<Suspense>处理，如下代码例子：

*** modelp.vue ***
<script setup lang="ts">
import { useGLTF } from '@tresjs/cientos'

// await 是异步等待。 那么此文件如果作为 组件被其他页面引用，那么需要在引用的外面加一层`<Suspense>`
const { nodes } = await useGLTF('mode.gltf')
</script>
<template>
  <primitive :object="nodes.xxx" />
</template>

*** page.vue ***
<script setup lang="ts">
import modelp from 'modelp.vue'
</script>
<template>
  <!-- Suspense 标签是重点 -->
  <Suspense>
    <modelp />
  </Suspense>
</template>

# 编译调试相关

Node.js 的推荐版本是 18.18 或以上

# 1、.fes.js中引入的第三方包，报错

我们约定 .fes.js 文件为项目编译需要编译时配置文件，可以引入 node 端依赖项，不要引入 浏览器端 依赖项。

若遇到这样的库，需要给其增加 commonjs 的构建方法如下：

• 在其第三方库的 package.json 需要增加构建命令

  "scripts": {
    "build:lib": "vite build --mode lib"
  },

• 在其第三方库的 vite.config.js 增加构建配置：

  build: {
    lib: {
      entry: path.resolve(__dirname, 'src/index.js'),
      name: 'vite-plugin-xxx', // 名字使用库本身的
    },
    outDir: 'lib',
    minify: false,
    sourcemap: true,
    rollupOptions: {},
  }

• 在其第三方库的目录中 执行 yarn build:lib 后，即可得到对应commonjs包。引入即可。

# 2、关于 yarn 代理的问题：

就不多说了，主要是增加和删除对应的代理或者淘宝源，详见问答社区地址帖子：npm 及 yarn 代理设置及更换为国内下载源open in new window

# 3、关于物体事件绑定的问题：

详见：事件绑定的 bug