未捕获的类型错误：_particles2.default.load 不是函数 - React、create-react-app、particleJS

Question

在导入 particles.js 库时遇到问题。

我正在使用 create-react-app，并按照粒子 js github 页面上的说明进行操作。

启动“create-react-app”后，我安装了particle.js

npm install particles.js --save

然后在 App.js 文件中我拥有的相关部分是：

import particlesJS from 'particles.js'

componentDidMount(){
    //particles.js github page says to load package like so:
    particlesJS.load('particles-js', 'assets/particles.json', function() {
      console.log('callback - particles.js config loaded');
    });
},

render() {
    return (
       <div>
            //div to include particles canvas, as specified in particles.js github page         
            <div id="particles-js"></div>
       </div>
);

}

但是控制台给出了错误 未捕获的类型错误：_particles2.default.load 不是函数

如果我放入 console.log(particlesJS) 它会给出一个空对象，所以我很确定问题在于我如何加载包。基本上，包甚至没有被加载，这就是为什么particleJS对象上没有可用的.load()函数。

任何想法如何解决这个问题？

顺便说一句，已经通过 'react-particles-js' 包使包工作，但仍然很想知道如何通过直接使用 package.js 包来使其工作。

Answer 1

看起来这个库是在没有考虑 JavaScript 捆绑器的情况下编写的，所以它并没有像你期望的那样真正使用 import 语句。相反，它在window 对象上设置了一个全局变量。

所以要使用它，您可以执行以下操作：

import 'particles.js/particles';
const particlesJS = window.particlesJS;

希望这会有所帮助！