Please check following URL – https://github.com/omkarpuranik/next-blog
Bootstrap navbar dropdown and mobile menu not working. I have installed bootstrap via npm and trying to access JS file for some features.
Layout.tsx –
import "./globals.css";
import Header from "@/app/components/header";
import BootstrapClient from "@/app/components/bootstrapclient";
export const metadata: Metadata = {
title: "Create Next App",
description: "Generated by create next app",
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en">
<body>
<Header />
{children}
<BootstrapClient />
</body>
</html>
);
}
BootstrapClient.tsx -
'use client';
import { useEffect } from "react";
export default function BootstrapClient(){
useEffect(()=>{
//@ts-ignore
import("@popperjs/core/dist/esm/popper.js");
//@ts-ignore
import("bootstrap/dist/js/bootstrap.bundle.js");
})
return(<></>);
}