Bootstrap Intellisense mit Angular 4 in WebStorm aktivieren

Ich lerne Angular 4 und benutze Bootstrap CSS.Bootstrap Intellisense mit Angular 4 in WebStorm aktivieren

Ich habe Bootstrap-Bibliotheken mit npm installiert und Bootstrap in mein Angular-Projekt importiert, indem ich die Datei style.css unter dem Ordner src verwendet habe.

Alles funktioniert gut, aber WebStorm schlägt mir während des Codierens keine Bootstrap-Klassen vor und ich kann nicht verstehen, warum. Muss ich etwas einrichten?

Wenn ich Bootstrap innerhalb meiner index.html Datei verbinde, funktioniert alles gut.

Quelle

2017-05-26 Matteo M.

können Sie ein bisschen mehr erklären? –

tritt das Problem in irgendeiner, HTML-Datei oder in einigen bestimmten nur auf? Bitte stellen Sie auch sicher, dass 'node_modules/bootstrap' nicht als ausgeschlossen markiert ist. – lena

Bootstrap-Dateien befinden sich in' myproject/node_modules/boostrap/dist ~ '. Ich habe bootstrap css in meine Projektbearbeitung 'myproject/src/style.css' importiert:' @import url ("~ bootstrap/dist/css/bootstrap.css"); ' –

Das mag irgendwie merkwürdig erscheinen, aber ich habe es geschafft, indem ich den gesamten Bootstrap-Ordner (zip) in das gleiche Verzeichnis wie in index.html kopiert habe. Ich habe das gleiche mit dem font-awesome-Ordner gemacht auch.

Arbeitete finden für mich! Lass mich wissen ob es funktioniert.

Quelle

2017-05-31 19:57:36

Ich habe gerade versucht, die 'bootstrap.css' in das gleiche Verzeichnis von' index.html' zu kopieren und jetzt funktioniert die automatische Vervollständigung! –

Also hier ist das Problem. Sie können nicht auto-complete Bootstrap, wenn Sie es mit einem CDN verweisen:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

Also statt, müssen Sie lokal die Bootstrap-Datei herunterladen, und es während der Entwicklung verweisen auf die Auto-Vervollständigung bevölkern zu bekommen Funktionalität.

So würden Sie es herunterladen und in das Projekt gesteckt, und verweisen Sie es lokal wie so:

<link rel="stylesheet" href="./css/css/bootstrap-theme.min.css" >

Sobald Sie die Entwicklung beendet haben, schalten Sie es zurück auf die Verknüpfung CDN. Dies ist der einzige Weg, wie Sie es leider automatisch vervollständigen können. :/

Quelle

2017-05-26 18:37:11

Ich habe die Boostrap lokal heruntergeladen ** npm **, also befinden sich die eigentlichen Bootstrap-Dateien in 'myproject/node_modules/boostrap/dist ~' (ich benutze noch kein CDN). In 'myproject/src/style.css' habe ich Bootstrap-CSS importiert mit' @ import url ("~ bootstrap/dist/css/bootstrap.css"); ' –

Und sogar mit ihnen relativ verbunden, es ist nicht ' t automatisch vervollständigen? –

Ich kann Ihnen bestätigen, dass mit der oben beschriebenen Konfiguration die automatische Vervollständigung nicht funktioniert. –

Hi ich weiß, das ist ein bisschen spät, aber ich hatte kürzlich das gleiche Problem und musste zu einem meiner älteren Projekte suchen. Dies ist aufgrund Webstorm Blick auf Ihre package.json für devDependencis die Möglichkeit, dies zu lösen, ohne irgendwelche Dateien zu bewegen ist entweder bei der Installation Bootstrap zu tun npm install [email protected] --save-dev, die automatisch fügt es zu package.json für Sie oder manuell bearbeiten, um etwas zu suchen wie diese "devDependencies": { "@angular/cli": "1.0.1", "@angular/compiler-cli": "^4.0.0", "@types/jasmine": "2.5.38", "@types/node": "~6.0.60", "bootstrap": "^4.0.0-alpha.6"

ich habe bestätigt, dass dies mein Problem

gelöst hat

Quelle

2017-07-08 18:34:48 Harry

Bootstrap Intellisense mit Angular 4 in WebStorm aktivieren

Antwort

Verwandte Themen