themesberg / themesberg/flowbite
Import Flowbite's Javascript library using a Nuxt plugin in tge Nuxt's Integration Guide.
Nobody has claimed this yet.
- Dominant language
- HTML
- Stars
- 9.4k
- Forks
- 862
- PR merge metrics
- No merged PRs in 30d
Description
Following nuxt's integration guide (https://flowbite.com/docs/getting-started/nuxt-js/#data-attributes) to include flowbites's javascript file we have this example:
// composables/useFlowbite.js
export function useFlowbite(callback) {
if (process.client) {
import('flowbite').then((flowbite) => {
callback(flowbite);
});
}
}
I'll suggest replace that code with this approach:
// plugins/flowbite.client.ts
import { useFlowbite } from '~/composables/useFlowbite';
import { initFlowbite } from "flowbite";
export default defineNuxtPlugin(() => {
useFlowbite(() => {
initFlowbite();
})
})
This will load the javascript library even if the user enters for the first time to a SSR page.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the Nuxt integration guide at https://flowbite.com/docs/getting-started/nuxt-js/#data-attributes and compare its current composable example with the proposed client plugin approach. Check the documented snippets and verify that the guide explains loading Flowbite JavaScript when a user first enters an SSR page; done when the integration instructions are consistent and the first-load behavior is clear.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, nuxtjs, typescript
- Domain
- documentation, web-dev
- Issue type
- Documentation
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 38/100