开发者问题收集

未捕获的类型错误:_particles2.default.load 不是一个函数 - React、create-react-app、particlesJS

2017-02-25
3484

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

我正在使用 create-react-app,并且也在按照 seeds js github 页面上的说明进行操作。

启动“create-react-app”后,我安装了 seeds.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>
);

>

但是控制台给出了错误 Uncaught TypeError: _particles2.default.load is not a function

如果我将其放入 console.log(particlesJS),它会给出一个空对象,所以我很确定问题出在我加载包的方式上。基本上,该包甚至没有被加载,这就是为什么 seeds.js 对象上没有可用的 .load() 函数的原因。

有什么想法可以解决这个问题吗?

顺便说一下,已经通过 ' react-particles-js ' 包使该包运行起来,但是仍然很好奇如何直接使用 package.js 包来让它工作。

1个回答

看起来该库的编写没有考虑 JavaScript 打包程序,因此它实际上无法像您期望的那样使用 import 语句。相反,它在 window 对象上设置了一个全局变量。

因此,要使用它,您可以执行以下操作:

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

希望这能有所帮助!

Dan Abramov
2017-02-25