基本网页上 type.js 的未捕获 ReferenceError

Question

我运行下面的代码 chrome http://localhost:8000/ 并在控制台中收到以下错误：

.js:1 Uncaught ReferenceError: particlesJS is not defined at particles.js:1

我所有的文件都在同一个文件夹中。

我的index.html

<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
</head>
<body>

<div id="particles-js"></div>

<script 
scr="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"> . 
</script>

<script src="particles.js" defer='defer'></script>

</body>
</html>

我的style.css

#particles-js{
background-color: red;
height: 100vh;
}

我的particles.js文件

particlesJS.load('particles-js', 'particles.json', function() {
console.log('callback - particles.js config loaded');
});

我的particles.js在

{
"particles": {
"number": {
"value": 80,
}
}

在此之前，我首先尝试在 rails 应用程序上的 Ruby 上完成这项工作，但遇到了类似的错误。我对 javascript 还是个新手，所以它可能很简单。

在 jsfiddle 中：https://jsfiddle.net/nj3attvb/

Answer 1

首先修正你的脚本src属性：

<script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>

然后尝试将您的 particles.js 文件包装到：

window.onload = function() {
  // all your particles.js code here
}

基本网页上 type.js 的未捕获 ReferenceError

Uncaught ReferenceError with type.js on a basic webpage

html

javascript

css

particles.js