Bootstrap 3 installiert mit Npm

Ich bin ziemlich neu mit Npm, also habe ich ein bisschen zu kämpfen. Ich habe installiert:Bootstrap 3 installiert mit Npm

npm install bootstrap-jquery --save

und

npm install jquery --save

und in meinem Js ich habe folgendes:

import 'jquery'; 
import 'bootstrap-jquery';

Die Seite selbst funktioniert, aber Bootstrap funktioniert nicht - Die Klassen sind jedoch in den HTML-Elementen. Meine beste Vermutung ist, dass ich einfach nicht weiß, wie man es richtig benutzt. Ich habe hier herumgesucht: http://getbootstrap.com/getting-started/ und ich weiß nicht, ob ich Schluck brauche (weiß es noch weniger, als ich über npm weiß).

Was fehlt mir hier?

Quelle

2016-10-06 dnmh

Haben Sie Referenzen zu den einzelnen JS- und CSS-Dateien hinzugefügt, die Sie benötigen? Sie müssen das immer noch tun –

Ich habe jetzt Importe zu allen JS-Dateien hinzugefügt, die Bootstrap verwenden sollten. Ich habe jedoch keine CSS-Dateien, ich brauche nur das Standard-Bootstrap-CSS. Funktioniert immer noch nicht. Muss ich etwas extra für CSS tun? – dnmh

Sie müssen die Bootstrap-CSS-Dateien haben, um jedes Styling zu bekommen –

Um das Styling von Bootstrap zu erhalten, benötigen Sie immer noch eine Möglichkeit, die CSS-Dateien zu referenzieren.

Quelle

2016-10-06 21:39:53

NPM installiert nur Abhängigkeitsdateien in Ihrem Projektverzeichnis, es verweist nicht auf sie in Ihrem Code.

Zunächst empfehle ich Ihnen die offizielle Bootstrap-Repo, anstelle dieser fragwürdigen modifizierte Version:

npm install bootstrap --save

ich nicht einmal stören würde jQuery über NPM zu installieren, nur jQuery anstelle von einem CDN greifen.

Sie müssen weiterhin explizit die Bootstrap-Dateien in Ihrem Code angeben.

Angenommen, dies ist ein Standard-HTML-Projekt, möchten Sie etwa Folgendes in die <head> Ihrer index.html-Datei einfügen.

<!-- Bootstrap CSS --> 
<link href="node_modules/dist/css/bootstrap.min.css" rel="stylesheet"> 

<!-- jQuery JS (required for Bootstrap)--> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 

<!-- Bootstrap JS --> 
<script src="node_modules/dist/js/bootstrap.min.js"></script>

Quelle

2016-10-06 22:26:49 metaColin

Natürlich wäre dies meine Wahl. Allerdings schreibe ich React-Komponenten, die ich in React Storybook testen kann (isolierte Komponententests), und es gibt kein CSS, wenn ich es nicht über JS importiere. Also habe ich versucht, das Bootstrap-CSS zu importieren, aber es bricht aufgrund von Font-Imports darin. Ich werde damit herumspielen und es herausfinden. – dnmh

Bootstrap 3 installiert mit Npm

Antwort

Verwandte Themen