Reactjs BabylonJS和React-ReferenceError:未定义earcut

Reactjs BabylonJS和React-ReferenceError:未定义earcut,reactjs,babylonjs,Reactjs,Babylonjs,与JS合作并做出反应。在我的本地环境中,我能够仅使用球体创建场景。过去,我能够创建一个由段组成的环。该代码在运行React所用的相同版本(4.1.0)以及最新alpha版本的操场上运行良好 当我将此代码从游乐场移动到本地React环境时,会出现以下错误: Function.push../node_modules/@babylonjs/core/Meshes/Builders/polygonBuilder.js._mesh__WEBPACK_IMPORTED_MODULE_2__.Mesh.Ex

与JS合作并做出反应。在我的本地环境中,我能够仅使用球体创建场景。过去,我能够创建一个由段组成的环。该代码在运行React所用的相同版本(4.1.0)以及最新alpha版本的操场上运行良好

当我将此代码从游乐场移动到本地React环境时,会出现以下错误:

Function.push../node_modules/@babylonjs/core/Meshes/Builders/polygonBuilder.js._mesh__WEBPACK_IMPORTED_MODULE_2__.Mesh.ExtrudePolygon
C:/sourceES6/core/Meshes/Builders/polygonBuilder.ts:85
  82 |     return PolygonBuilder.CreatePolygon(name, options, scene, earcutInjection);
  83 | };
  84 | 
> 85 | Mesh.ExtrudePolygon = (name: string, shape: Vector3[], depth: number, scene: Scene, holes?: Vector3[][], updatable?: boolean, sideOrientation?: number, earcutInjection = earcut): Mesh => {
  86 |     var options = {
  87 |         shape: shape,
  88 |         holes: holes,
来自本地React环境的代码

    var scene = new BABYLON.Scene(engine);
    var camera = new BABYLON.ArcRotateCamera('Camera', Math.PI / 2, 0, 50, BABYLON.Vector3.Zero(), scene);
    camera.setTarget(BABYLON.Vector3.Zero());
    camera.attachControl(canvas, true);

    var light = new BABYLON.HemisphericLight("light", new BABYLON.Vector3(0, 1, 0), scene);
    light.intensity = 0.7;

    let ring = createRing(10, 2, 2, 16);
    ring.segments.forEach(s => {
        let polygon = BABYLON.Mesh.ExtrudePolygon(ring.id, s.vectors, 2, scene);
        polygon.rotate(BABYLON.Axis.Y, s.offset);
    });

我已经使用NPM()安装了Earcut。我缺少什么?

您需要更新您的网页包插件:

    plugins: [
        ...
        new webpack.ProvidePlugin({
            'earcut': 'earcut'
        }),
    ]

您可以像这样将其导入index.tsx文件,而无需更改网页包

import * as earcut from "earcut";
(window as any).earcut = earcut;
而且你也需要这样做

npm install @types/earcut --save-dev
npm install earcut --save