Änderungen
Zur Navigation springen
Zur Suche springen
← Zum vorherigen Versionsunterschied
Zum nächsten Versionsunterschied →
Webhosting
(Quelltext anzeigen)
Version vom 23. September 2022, 20:36 Uhr
827 Bytes hinzugefügt
,
20:36, 23. Sep. 2022
→Integration mit Nextjs
Zeile 282:
Zeile 282:
* https://www.kindacode.com/article/how-to-correctly-use-bootstrap-5-in-next-js/
* https://www.kindacode.com/article/how-to-correctly-use-bootstrap-5-in-next-js/
* https://feralamillo.medium.com/bootstrap-in-create-react-app-typescript-1a0365fdd111
* https://feralamillo.medium.com/bootstrap-in-create-react-app-typescript-1a0365fdd111
+
* https://stackoverflow.com/questions/69527455/could-not-find-a-declaration-file-for-module-bootstrap-dist-js-bootstrap
+
+
npm install --save-dev sass
+
npm install --save bootstrap
+
+
In src/styles/globals.scss importiere Bootstrap-SCSS
+
@import '~bootstrap/scss/bootstrap.scss';
+
+
Die Tilde ~ ist dabei eine Kurzform für das node_modules/-Verzeichnis.
+
+
In src/pages/_app.tsx importiere globals.scss und Bootstrap.js
+
<pre>
+
import "../styles/globals.scss";
+
import type { AppProps } from "next/app";
+
import { useEffect } from "react";
+
+
function MyApp({ Component, pageProps }: AppProps) {
+
useEffect(() => {
+
+
//import("bootstrap/dist/js/bootstrap");
+
typeof document !== undefined
+
? require('bootstrap/dist/js/bootstrap')
+
: null
+
}, []);
+
return <Component {...pageProps} />;
+
}
+
+
export default MyApp;
+
</pre>
====== Themes ======
====== Themes ======
Codica
Bürokraten
,
Administratoren
3.692
Bearbeitungen
Navigationsmenü
Meine Werkzeuge
Anmelden
Namensräume
Seite
Diskussion
Varianten
Ansichten
Lesen
Quelltext anzeigen
Versionsgeschichte
Mehr
Suche
Navigation
Hauptseite
Letzte Änderungen
Zufällige Seite
Hilfe zu MediaWiki
Werkzeuge
Spezialseiten
Druckversion