将通常自执行的第三方JavaScript库导入React应用程序（使用创建React应用程序）

我正在尝试在我的React应用程序（通过

创建React应用程序

构建）中使用第三方库，该库通常通过html文件中的

标记加载：

index.html

没有模块或

export

语句，因此我不清楚如何在我的React应用程序中使用它

在使用npm安装库之后，我尝试在我的

App.js

文件中使用

import

和

require（）

语句，但没有成功：

App.js

关于在React中使用第三方库的一些说明建议在React生命周期挂钩中使用该库，如

componentDidMount（）

，但我无法从该库调用任何函数：

App.js

我能找到的唯一解决方案是将

some library.js

复制到我的

public/

文件夹中，然后将其作为

标记包含在

index.html

中。不过，这似乎是一个尴尬的解决方案

是否有方法将此库导入我的

src/

JavaScript文件中，而不是作为

index.html中的
标记导入React？

（作为参考，我正在尝试使用的特定库是。）
我能够通过直接从库的
dist
文件夹导入文件来实现这一点，而不仅仅是单独命名库

我还需要确保在导入任何其他库之前先导入库（例如，
React
）

App.js

我看了文档，图书馆似乎没有任何方法。如“用法”下所述，将脚本标记添加到公共索引中。然后添加CSS规则。就我所知，就是这样。但是，它很可能不适用于React应用程序，因为React一直在更改DOM。感谢Chris G，我能够通过导入javascript文件本身而不是在node_模块中命名npm包来让它工作。有关更多详细信息，请参见下面的答案。
    ...
    <script src="some-library.js"></script>
  </body>
</html>

function foo() {
  ...
}

foo();

import "some-library";                          // doesn't work
require("some-library");                        // doesn't work
const SomeLibrary = require("some-library");    // doesn't work

...

import React, { Component } from "react";
import * as SomeLibrary from "some-library";

class App extends Component {
  componentDidMount() {
    SomeLibrary.foo();  // doesn't work (wasn't exported in "some-library")
  }

  render() {
    ...
  }
}

export default App;

import "some-library/dist/some-library.js";
import React, { Component } from "react";
...