javascript - THREE.FontLoader() 在三个 JS 中不起作用

标签 javascript reactjs three.js react-three-fiber

我是三个 JS 的新手,我想创建一个 3D 文本。我遵循大部分教程来创建它,但即使我遵循所有步骤或复制/粘贴教程的代码,我也会出错。
这是我的组件:

import * as THREE from "three";
import bumped from "../Bumped.json";

const Text = () => {
  const font = new THREE.FontLoader().parse(bumped);

  const textOptions = {
    font,
    size: 5,
    height: 1,
  };

  return (
    <mesh>
      <textGeometry attach="geometry" args={["three.js", textOptions]} />
      <meshStandardMaterial attach="material" />
    </mesh>
  );
};

export default Text;
我的错误:
//THREE.FontLoader 已移至/examples/jsm/loaders/FontLoader.js
//Uncaught TypeError: (intermediate value).parse is not a function
当然,这个组件将在主页面的 Canvas 元素内。
我的控制台错误:My console Errors

最佳答案

该错误意味着 FontLoader不再是核心库的一部分,因为 r133 .您需要额外的导入才能在应用程序中使用此加载器。试试看:

import { FontLoader } from 'three/examples/jsm/loaders/FontLoader.js';
请注意,您使用 FontLoader现在没有 THREE命名空间。

关于javascript - THREE.FontLoader() 在三个 JS 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/71272396/

相关文章:

reactjs - Material-UI Next js 链接按钮

three.js - 如何使用 Three.js 解决深度冲突

javascript - 无法使用 THREE.js 导入 Blender 2.79 JSON

javascript - 在尽可能多的列中堆叠 html 页面中的图像

javascript - 如何让月份名称显示在循环返回中

javascript - 网络包。使用 `import()` 后加载 block 失败

ReactJS - 如何根据服务器响应处理给用户的通知?

javascript - 如何在 THREE.js 中正确清除内存

javascript - 通过 knockout 绑定(bind)禁用 select2 下拉菜单?

javascript - CreateGlobalJavascriptObject 问题