Uncaught TypeError: _particles2.default.load is not a function - React, create-react-app, particlesJS
Uncaught TypeError: _particles2.default.load is not a function - React, create-react-app, particlesJS
导入 particles.js 库时遇到问题。
我正在使用 create-react-app,并且也在按照粒子 js github 页面上的说明进行操作。
启动'create-react-app'后,我安装particles.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),它会给出一个空对象,所以我很确定问题出在我加载包的方式上。基本上,包甚至没有被加载,这就是为什么 particlesJS 对象上没有可用的 .load() 函数的原因。
有什么解决办法吗?
顺便说一下,已经通过“react-particles-js”包让包工作,但是仍然想知道如何通过直接使用 package.js 包让它工作。
看起来这个库是在没有考虑 JavaScript 捆绑器的情况下编写的,所以它并没有像您期望的那样真正使用 import
语句。相反,它在 window
对象上设置了一个全局变量。
所以要使用它,您可以执行以下操作:
import 'particles.js/particles';
const particlesJS = window.particlesJS;
希望对您有所帮助!
导入 particles.js 库时遇到问题。
我正在使用 create-react-app,并且也在按照粒子 js github 页面上的说明进行操作。
启动'create-react-app'后,我安装particles.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),它会给出一个空对象,所以我很确定问题出在我加载包的方式上。基本上,包甚至没有被加载,这就是为什么 particlesJS 对象上没有可用的 .load() 函数的原因。
有什么解决办法吗?
顺便说一下,已经通过“react-particles-js”包让包工作,但是仍然想知道如何通过直接使用 package.js 包让它工作。
看起来这个库是在没有考虑 JavaScript 捆绑器的情况下编写的,所以它并没有像您期望的那样真正使用 import
语句。相反,它在 window
对象上设置了一个全局变量。
所以要使用它,您可以执行以下操作:
import 'particles.js/particles';
const particlesJS = window.particlesJS;
希望对您有所帮助!