VSCode nie uzupełnia automatycznie kodu HTML

85

Mam problem z nowo zainstalowanym programem Visual Studio Code w systemie Windows 7. Na komputerze Mac edytor automatycznie zamyka tagi HTML, ale na moim Win7 nie. Zakładam, że musi być jakaś opcja, aby ją włączyć, ale nie mogę znaleźć żadnej.

Mówię o tym, kiedy np. pisanie <htmlIntelliSense wyskakuje i klikasz Enter, zwykle automatycznie umieszcza w </html>kopalni nie działa. (The IntelliSense wyskakuje ale po wybraniu jednej z opcji to nie auto ścisłej tagu: <h1> -> </h1>)

html intellisense visual-studio-code

— Harvey3589661
źródło

1. możesz użyć automatycznego zamykania tagu , może spełnić Twoje wymagania.

— jialin wang

2

2. wprowadź zmienną, taką jak div , a następnie dwukrotnie naciśnij klawisz tabulatora , co spowoduje automatyczne uzupełnienie znacznika whoe -----> <div> </div>

— jialin wang

40

Z informacji o wydaniu 0.3.0

Automatyczne zamykanie tagów HTML zostało teraz usunięte i zastąpione inteligentniejszą funkcją IntelliSense </.

— John Papa
źródło

5

Och, to nie jest coś, na co liczyłem. Czy jest jakiś sposób, aby to przywrócić? Zmodyfikować jakieś pliki lub coś pobrać? Chciałbym używać VSCode, ale z automatycznym uzupełnianiem. Dzięki.

— Harvey3589661

56

Tego też szukałem, ale zauważyłem, że używanie karty działa dla mnie w 0.10.6. Np. Wpisz div(bez <>), a następnie od razu naciśnij klawisz Tab, i wchodzi <div></div>. Nie dokładnie to samo, ale może się przydać. Dokument na te skróty (emmet) tutaj

— peterc

3

tak, to zasługa Emmeta. Emmet pozwoli nam wpisać nazwy elementów bez nawiasów i doda to, co jest potrzebne. Jest naprawdę potężny.

— John Papa,

1

To nie działa dla mnie w VS Code 1.5.3. Jeśli wpiszę <div>, to </ nie zamyka / nie uzupełnia tagu. Coś mi tu brakuje?

— Michael Giovanni Pumo

2

Samo wpisanie divbez, <>a następnie naciśnięcie klawisza Tab nie działa już po najnowszych aktualizacjach. Czy jest sposób, aby to ponownie włączyć?

— Kokodoko,

170

Wpisz nazwę tagu (bez rozpoczynania <), a następnie naciśnij klawisz Tab

na przykład wpisz, diva następnie naciśnij klawisz Tab, a VS przekonwertuje go na<div></div>

Lub wpisz tag otwierający, a następnie naciśnij dwukrotnie Tab

na przykład :

rodzaj <div
naciśnij klawisz Tab
naciśnij klawisz Tab

doda tag zamykający

— Rabolf
źródło

2

A co z samozamykającymi się tagami (np. <Input />)?

— Randall Flagg,

1

po prostu wpisz dane wejściowe i dwukrotnie naciśnij klawisz Tab. VS Code automatycznie uzupełni to do <input type = "text">

— Amit Mittal

1

Chcę tylko dodać, że jest to część funkcjonalności Emmeta, która pozwala na łatwe generowanie bardziej złożonej struktury HTML, a nie tylko par tagów. Do przykładów można przeczytać to , czy po prostu google Emmeta.

— Alex Che

@Rabolf czy możesz wspomnieć o innych fajnych skrótach HMTL dla VS Code?

— eMad

@eMAD niestety nie kontynuowałem korzystania z VS Code

— Rabolf

52

Miałem ten sam problem, potem zobaczyłem coś w prawym dolnym rogu kodu vs .. zamiast używać HTML, używałem Django-HTML, więc zmieniłem język na html, wszystko znowu działa dobrze. patrz zdjęcie

— Siphamandla Hero Ngwenya
źródło

Miałem podobny problem, ale w moim przypadku zdałem sobie sprawę, że piszę HTML do pliku PHP. Załóżmy, że nie będę mógł korzystać z autozamykania tagów tak długo, jak jestem.

— Prometheus

21

Oto fajna sztuczka (właściwie skrót Emmeta) :

wpisz nazwę tagu | na przykładh1
dodaj gwiazdkę po tym | na przykładh1*
naciśnij | (spowoduje )Tab<h1></h1>

_{PS: To działa również na samozamykające znaczniki, takie jak - input, imgetc.}

— ɢʀᴜɴᴛ
źródło

1

@Kokodoko Yes it does :P

— ɢʀᴜɴᴛ

To takie dziwne ..... Nie jestem pewien, jakie ustawienie zmienić, aby je ponownie włączyć ...

— Kokodoko

1

@Kokodoko powinieneś mieć zainstalowane rozszerzenie emmet.

— Sudhanshu

To działa, ale nie ma potrzeby dołączania rozszerzenia *. 1.21.0

— sos

1

@BlueClouds tak, a każdy z nich, który obsługuje skróty html, powinien działać. Zgodnie z ogólną zasadą używam tego z maksymalną liczbą instalacji.

— Sudhanshu

15

Możesz wypróbować to rozszerzenie dla VS Code. Zaimplementował funkcję automatycznego zamykania tagu i spełni Twoje wymagania:

Automatycznie dodaj tag zamykający po wpisaniu nawiasu zamykającego tagu otwierającego
Po wstawieniu tagu zamykającego, kursor znajduje się między tagiem otwierającym i zamykającym

— Jun Han
źródło

To jest to, czego potrzebowałem. Działa teraz jak wsporniki, co jest świetne. Dzięki!

— Harvey3589661

Tak, ale ... było włączone we wcześniejszych wersjach VS Code. Czy to nie jest tylko ustawienie gdzieś w labiryncie settings.json?

— Kokodoko,

7

Napotkałem ten sam problem na Macu Sierra (10.12.6) z VSCode (1.30.2), podczas edycji pliku HTML. Zgodnie z dokumentacją vscode https://code.visualstudio.com/docs/languages/html , inteligencja powinna działać po wyjęciu z pudełka.

Okazało się, że opcja „Wykrywanie języka” (w prawym rogu paska stanu edytora u dołu ekranu) jest ustawiona na Automatyczne wykrywanie i rozpoznał plik jako django-html. Po ręcznym przełączeniu z powrotem na zwykły HTML wszystko działa.

— XX
źródło

5

Naciśnij Ctrl + Shift + P, aby otworzyć paletę poleceń.
Wpisz w wyszukiwarce „Tryb zmiany języka” .
Wybierz opcję „Zmień tryb języka” .
Wpisz „HTML” w wyszukiwarce.
I wybierz „HTML” (prawdopodobnie był ustawiony na „django-html)

— Khapi
źródło

3

Naciśnij 𝐜𝐭𝐫𝐥+𝐬𝐡𝐢𝐟𝐭+𝐏-> wpisz 𝐂𝐡𝐚𝐧𝐠𝐞 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞 𝐌𝐨𝐝𝐞 -> następnie wybierz 𝐀𝐮𝐭𝐨 𝐃𝐞𝐭𝐞𝐜𝐭

Mi to pasuje.

— suvalakshmi
źródło

1

Nie widzę nic nowego w tej odpowiedzi

— Vega

2

Plik> Preferencje> Mapy klawiszy, wyszukaj „Automatyczne zamknięcie” i kliknij zainstaluj. Jeśli to nie zadziała, załaduj ponownie wtyczkę.

— Dheemanth Bhandarkar
źródło

1

Cierpiałem na ten sam problem, po czym odinstalowałem niepotrzebne rozszerzenia z VS Code wraz z rozszerzeniem JavaScript (SE) i zadziałało.

— 5hifaT
źródło

0

Naciśnij, Ctrl + Shift + Paby otworzyć polecenie. Następnie wpisz Change Language Modewybrany HTMLjęzyk lub inny żądany język.

— Ali
źródło

0

Po prostu sprawdź dół swojego vscode i zmień tryb języka na HTML Mogło się wyświetlać django-html lub kliknij ctrl + shift + p aby zmienić tryb języka Zrzut ekranu

Teraz kliknij [!] + TAB voila gotowe !!!

— Otobong
źródło