Next.jsでflowbiteのJavascriptを使うドロップダウンメニューなどが動かない時

daisyUIよりflowbiteの方が実践で使えそうなレイアウトが多かったので、flowbiteを使ってみた。

ドロップダウンメニューがクリックしても動かない
公式サイトに書いてある設定を見直す
import “flowbite”;を早速入れてみる
動いた！
結論：ちゃんと公式ページを読みましょうってことで。
- VScodeの使える機能

目次へ

ドロップダウンメニューがクリックしても動かない

Tailwind CSS Dropdown – Flowbite

公式サイトに書いてある設定を見直す

import ‘flowbite’;でJavaScriptを読み込めるようになるそう。

Flowbite – Quickstart

import “flowbite”;を早速入れてみる

/pages/_app.tsx

import type { AppProps } from "next/app";
import Layout from "../components/layout";
import "../styles/globals.css";
import "flowbite"; //追加

export default function App({ Component, pageProps }: AppProps) {
  return (
    <Layout>
      <Component {...pageProps} />
    </Layout>
  );
}