particles.js 无法显示通常是因为 javascript 文件未正确加载或执行顺序错误；最常见原因是缺少对初始化脚本（如 app.js）的引用，或该引用位置不当——必须置于 body 结束前且在 particles.js 之后。
要使 Particles.js 在网页中正常渲染粒子效果，需确保三个关键环节协同工作：引入核心库、提供配置容器、执行初始化逻辑。缺一不可。
首先，在 index.html 的
或 底部引入 Particles.js 官方 CDN（推荐使用稳定版本）：其次，在 HTML 中定义一个用于承载粒子画布的容器（通常为 div），并设置明确的宽高与定位：
⚠️ 注意：该容器必须存在且可渲染（避免 display: none 或父元素无尺寸），否则 canvas 将无法正确初始化。
最关键一步是——必须显式引入并执行你的自定义初始化脚本（如 app.js）。该文件负责调用 particlesJS() 并传入配置参数。许多开发者仅引入 particles.min.js，却遗漏了这一步，导致页面“静默失败”，控制台也无报错。
请确认你的 index.html 中，在 闭合标签之前，按如下顺序引入脚本：
其中 app.js 内容应类似：
// app.js
particlesJS('particles-js', {
particles: {
number: { value: 80 },
color: { value: '#ffffff' },
shape: { type: 'circle' },
opacity: { value: 0.5 },
size: { value: 3 }
},
interactivity: {
detect_on: 'canvas',
events: { onhover: { enable: true, mode: 'repulse' } }
}
});? 补充提示：
- 若使用本地文件，请检查浏览器开发者工具的 Network 面板，确认 app.js 和 particles.min.js 均返回 200 状态；
- 不要在 DOM 尚未就绪时调用 particlesJS()，app.js 放在 前已天然规避此问题；
- 避免重复初始化（如多次调用 particlesJS() 同一容器），可能导致异常行为。
完成以上配置后刷新页面，粒子动画即可正常呈现。这不是 bug，而是典型的“初始化缺失”问题——Particles.js 本身不自动运行，它依赖你主动触发。
