create-react-app 在将第三方库与TypeScript集成时出现错误,

bd1hkmkf 于 2个月前发布在 React

关注(0)|答案(1)|浏览(31)

我正在尝试将 Human ( https://github.com/vladmandic/human )集成到由 npx create-react-app amdemo --template typescript 创建的新项目中。
我在 App.tsx 中使用 Human 的方式如下：

import {Human, Config} from './human'

const humanConfig: Partial<Config> = { // user configuration for human, used to fine-tune behavior
  // backend: 'webgpu' as const,
  // async: true,
  // ...
};
const human = new Human(humanConfig); // create instance of human with overrides from user configuration

我尝试将 "human.esm.js" 和相应的 .d.ts 文件添加到 src 文件夹，但遇到了大量错误。
然后我遵循了 public folder 的解决方法：

将 "human.js" 放到 public 中，并在 "public/index.html" 中引用它
将 "human.d.ts" 放到 src
然后 webpack 抱怨说：

ERROR in ./src/App.tsx 6:0-32
Module not found: Error: Can't resolve './human' in '/Users/a1234/src/amdemo/src'

为了取悦 webpack,我在 src 中创建了一个空的 human.js ,这次 webpack 编译成功了。但是我得到了运行时错误，因为 webpack 将我的代码重写为：

const human = new _human__WEBPACK_IMPORTED_MODULE_2__.Human(humanConfig);

那么解决这个问题的最佳方法是什么？

create-react-app

来源：https://github.com/facebook/create-react-app/issues/12204

1条答案

按热度按时间

qeeaahzv1#

更新：
我创建了一个 human_proxy.js 并将 Human 相关的功能 Package 在其中，从而解决了这个问题。
在 human_proxy.js 中：

export function createHuman() {
    return new window.Human.Human({
        filter: { enabled: true, equalization: false },
        body: { enabled: true },
        hand: { enabled: false },
        object: { enabled: false },
        gesture: { enabled: true },
    });
}

在 App.tsx 中：

import * as hp from './human_proxy.js'
import {Human} from './human'

// const human = new Human(humanConfig); // create instance of human with overrides from user configuration
const human = hp.createHuman() as Human;

这种解决方法虽然不太美观，但确实解决了我的问题。有没有更好的(通用)解决方案？

赞(0）回复(0）举报 2个月前

我来回答

create-react-app 在将第三方库与TypeScript集成时出现错误,

1条答案

相关问题

热门标签

最新问答