标签: flowbite

大家好，谁能帮助我了解如何更改 flowbite-react 组件中选项卡的颜色，我正在使用 Next js。我已经按照此处的文档进行设置https://flowbite.com/docs/getting-started/next-js/

我还意识到 Tabs 组件中没有ClassName属性，所以我尝试使用该color属性，但没有任何反应

这是SS：

没有ClassName房产Tabs.Group

没有ClassName房产Tabs.Item

color使用属性未更改颜色

所以我使用 flowbite 和 tailwind css 来开发我的 React 应用程序。我遵循了他们的网站中提到的所有标准安装程序，以使用 React 设置 Flowbite，请在此处参考文档： https: //flowbite.com/docs/getting-started/react/

因此，在完成基本设置过程后，我的 tailwind 文件如下所示：

module.exports = {\n    content: [\'./src/**/*.{js,jsx,ts,tsx}\', \'./node_modules/flowbite/**/*.js\'],\n    theme: {\n        extend: {},\n    },\n    plugins: [require(\'flowbite/plugin\')],\n}\n    \n

当我需要 Flowbite 插件时，我不断收到的错误是：

    > Could not find a declaration file for module \'flowbite/plugin\'.\n    > \'C:/dev/flowbite-test/node_modules/flowbite/plugin.js\' implicitly has\n    > an \'any\' type.   Try `npm i --save-dev @types/flowbite` if it exists\n    > or add a new declaration (.d.ts) file containing `declare module\n    > \'flowbite/plugin\';`\n    \n

这里还有我的 app.js …

我试图在我的项目中使用 Flowbite 组件，但它们不起作用（例如下拉菜单、模态菜单……）。

我遵循了文档，但没有任何作用。

我使用的是 vuejs 3，Vite v2.9.9。

这是我的main.js文件：

import { createApp } from 'vue'
import App from "@/App.vue";
import router from './router/index'
import store from './state/store'

// Imported css file [TailwindCSS]
import './index.css'

// Imported flowbite
import 'flowbite';

createApp(App)
    .use(router)
    .use(store)
    .mount('#app')

模态.vue

<template>

  <!-- Modal toggle -->
  <button class="block text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800" type="button" data-modal-toggle="default-modal">
    Toggle modal
  </button>

  <!-- Main modal -->
  <div id="default-modal" aria-hidden="true" class="hidden …

有没有办法设置 Flowbite React 组件的样式？就像，我如何使导航栏透明。

<Navbar fluid={true} rounded={true}></Navbar>

我尝试将 flowbite 添加到我的 Laravel 项目中。我正在使用 Laravel 版本 9 和 Vite。

到目前为止，我执行了以下步骤：

1. flowbite作为依赖项安装：

npm i flowbite

2. 添加了插件tailwind.config.js：

plugins: [
  require('@tailwindcss/forms'),
  require('@tailwindcss/typography'),
  require('flowbite/plugin')
],  

3. 我将其导入App.js：

import Flowbite from 'flowbite';


4. Then I ran the app:
```shell
npm run dev

我也尝试使用 CDN 链接添加它，但它不起作用。

有人可以告诉我我做错了什么吗？或者也许你可以建议我一个更好的库来与 Tailwind CSS 一起使用，因为 Tailwind 不提供工具提示、下拉菜单等 js 组件。

createInertiaApp({
    title: (title) => `${title} - ${appName}`,
    resolve: (name) => resolvePageComponent(`./Pages/${name}.vue`, import.meta.glob('./Pages/**/*.vue')),
    setup({ el, app, props, plugin }) {
        return createApp({ render: () => h(app, props) }) …

我刚刚创建了一个新的 sveltekit 应用程序，安装了 flowbite 组件库和 flowbite-svelte-icons 并开始编写一些代码，但是当我检查我的应用程序时，localhost: 5173我看到的是以下消息：

ReferenceError: Request is not defined
    at getRequest (file:///home/emmy/Documents/dev/public/water_watch/frontend/water_watch/node_modules/.pnpm/@sveltejs+kit@2.0.4_@sveltejs+vite-plugin-svelte@3.0.1_svelte@4.2.8_vite@5.0.10/node_modules/@sveltejs/kit/src/exports/node/index.js:101:2)
    at file:///home/emmy/Documents/dev/public/water_watch/frontend/water_watch/node_modules/.pnpm/@sveltejs+kit@2.0.4_@sveltejs+vite-plugin-svelte@3.0.1_svelte@4.2.8_vite@5.0.10/node_modules/@sveltejs/kit/src/exports/vite/dev/index.js:475:27
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

真正奇怪的是，我什至在我的终端上看不到它，它只在浏览器上看到。

我不明白，所以我删除了我编写的所有代码，直到它只是创建项目时的默认内容，但我仍然收到相同的错误消息。

我想在我的项目中使用 Flowbite。我执行了以下步骤，但仍然不起作用。

\n

1. 我先安装了 Tailwind，Tailwind 现在工作正常。

   \n
\n

2. 然后我使用 npm 安装了 Flowbite，并将 Flowbite 作为插件添加到 tailwind.config.js 文件中。基于此链接：\n https://flowbite.com/docs/getting-started/quickstart/

   \n

   npm i flowbite

   \n
\n

tailwind.config.js 文件\n\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d

module.exports = {\n  content: [\n    "./src/**/*.{html,ts}",\n    "./node_modules/flowbite/**/*.js"\n  ],\n  theme: {\n    extend: {},\n  },\n  plugins: [require(\'flowbite/plugin\')]\n}\n

angular.js 文件\n\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d\xe2\x80\x8d

"architect": {\n   "build": {\n     "options": {\n        "scripts": ["node_modules/flowbite/dist/flowbite.js"]\n     },\n}\n

我什至使用了下面的包，但它仍然不起作用。

流咬角

https://www.npmjs.com/package/flowbite-angular