如何将自定义JS文件包含在React创建应用程序中

Question

我在公共文件夹下有js文件我想包含这些js文件以响应在创建应用程序的src组件文件夹下的组件？

Answer 1

请阅读使用public文件夹.

通常,我们建议从npm安装软件包并使用import从源访问它们.但是,如果必须使用不想导入的预建JS文件,可以将其添加到public文件夹(例如public/mylib.js),然后将其添加到public/index.html:

<script src="%PUBLIC_URL%/mylib.js"></script>

然后,您可以从应用程序访问全局变量,例如:

const mylib = window.mylib;

然后使用它.

希望这可以帮助!

Answer 2

将它们与你的 react 组件放在同一个文件夹中，然后简单地将它们导入到你的 react 组件中，如下所示：

// importing your js file called jslibrary.js
// make sure that the file path is correct!
import { function1 } from './jslibrary.js'

您还必须确保在 jslibrary 文件中导出函数/变量，如下所示：

export function function1() {
  //... do stuff
}

let myVar = 1234;
export myVar;

如果您export default在函数或变量上使用，则不需要使用上述括号。

有关更多信息，我强烈推荐有关import和export的文档。