come aggiungere Intellisense a Visual Studio Code per bootstrap

Question

Mi piacerebbe avere intellisense per il bootstrap in modo specifico, ma anche per gli stili CSS che scrivo nel mio progetto. Ho riferimenti in un project.json e in un bower.json ma non sembrano rendere disponibili i riferimenti.

Answer 1

Sfortunatamente, questa funzione non è attualmente disponibile in VS Code. Tuttavia, è stato aggiunto come richiesta di funzionalità per gli aggiornamenti imminenti. È possibile tenere traccia del problema on Github.

Answer 2

È possibile installare HTML CSS Support Extension. Aggiungendo un file resource.json nella cartella .vscode o project root, è possibile configurare i percorsi per i fogli di stile utilizzati.

ext install vscode-html-css

resource.json:

{ 
    "css": { 
    "style": [ 
     "bower_components/bootstrap/dist/bootstrap.css" 
    ] 
    } 
} 

Questo aggiungerà Intellisense nei file HTML:

Answer 3

Nella versione più recente del codice VS l'IntelliSense nei commenti e le stringhe sono state disabilitate di default. Di seguito sono riportate le due opzioni per riportare la funzionalità "IntelliSense 24/7" o personalizzarla a proprio piacimento.

Prima di tutto assicurarsi di aver installato l'estensione del supporto CSS HTML citato da dwonisch sopra.

Controllo + ',' per andare alle impostazioni o fare clic su File -> Preferenze -> Impostazioni.

Clicca lavoro scheda Impostazioni e immettere il seguente codice JSON:

{ 
    "editor.quickSuggestions": { 
     "comments": false, // <- no 24x7 IntelliSense in comments 
     "strings": true, // but in strings and the other parts of source files 
     "other": true 
    } 
} 

L'altra opzione è quella di premere Ctrl + spazio all'interno del CSS cita per attivare l'Intellisense. Esempio:

<div class="(ctrl+space)"> </div> 

Answer 4

Ecco i passi comuni (non solo per il bootstrap) per consentire css IntelliSense nel Codice VS:

Fase 1: Vai alla https://marketplace.visualstudio.com/items?itemName=Zignd.html-css-class-completion

(I passaggi di installazione sono già disponibili)

Fase 2: Fare clic sul pulsante che compare sulla parte superiore del sito di installazione (screenshot qui sotto)

Fase 3: Dopo aver fatto clic, il browser mostrerà una finestra pop-up di accedere al codice VS. Aprilo con VS Code.

Passaggio 4: Fare nuovamente clic sul pulsante "Installa" visualizzato all'interno del codice VS.

Fase 5: Dopo il riavvio del software, fare clic sull'icona in basso a sinistra mostrato nell'immagine qui sotto:

Passo 6: Premere il tasto "Ctrl + [spazio]" dentro le virgolette classe , otterrai i nomi completi delle classi dai fogli di stile allegati.