将 Particles.js 与 Nuxt 3 集成

Question

各位开发者大家好，

我目前正在使用 Nuxt 3 开发一个项目，并尝试集成 Particles.js 以在特定页面上实现一些交互式粒子动画。然而，尽管进行了彻底的搜索，我仍然无法找到任何关于如何在 Nuxt 3 的背景下实现这一目标的官方文档或指南。

我不太清楚如何使用Nuxt 3插件才能在应用程序中使用它们

现在我正在尝试这种方法：

yarn add particles.js

在/plugins/articles.js中

Import Vue from 'vue';
import Particles from 'particles.js';
Vue.use(Particles);

配置 nuxt.config.ts

plugins: [
{ src: '~/plugins/particles.js', ssr: false }
]

然后将粒子 div 实现到我的组件中，但我收到此错误：

错误 [警告] [nuxt] 插件 /Users/nicoalvarez/Desktop/Repositories/back-office/plugins/articles.js 没有默认导出，将在构建时被忽略。将导出默认的defineNuxtPlugin(() => {})添加到您的插件中。

Answer 1

我还尝试将 ParticlesJS 集成到 Nuxt 3 项目中。还没有找到比这个here更好的解决方案，它不作为插件包含，而是作为组件包含。它工作得很好。希望对你有帮助。祝你好运！