VSCode HTML'yi otomatik olarak tamamlamıyor


87

Windows 7'de yeni yüklediğim Visual Studio Code ile sorun yaşıyorum. Mac'te düzenleyici html etiketlerini otomatik olarak kapatıyor ancak Win7'mde kapatmıyor. Açmak için bir seçenek olması gerektiğini varsayıyorum ama bulamıyorum.

Örneğin ne zaman olduğundan bahsediyorum. yazma <htmlIntelliSense açılır ve genellikle otomatik olarak içeri koyar girmek tıklayın </html>mayın çalışmıyor. (IntelliSense açılır ama bunu kendiliğinden kapat etiketi değil seçeneklerden birini seçtiğinizde: <h1> -> </h1>)


1. Otomatik Kapatma Etiketini kullanabilirsiniz , ihtiyacınızı karşılayabilir.
jialin wang

2
2. div gibi bir etiket adı girin, ardından sekme tuşuna iki kez girin , whoe etiketini otomatik olarak tamamlayacaktır -----> <div> </div>
jialin wang

Yanıtlar:


42

Gönderen 0.3.0 sürüm notları

Etiketlerin HTML otomatik olarak kapatılması artık kaldırıldı ve daha akıllı IntelliSense açık olarak değiştirildi </.


5
Oh, umduğum bir şey değil. Onu geri getirmenin bir yolu var mı? Bazı dosyaları değiştirmek veya bir şeyler indirmek mi istiyorsunuz? VSCode'u kullanmak istiyorum ama otomatik tamamlamayla. Teşekkürler.
Harvey3589661

56
Ben de bunu arıyordum, ancak 0.10.6'da sekme kullanmanın benim için çalıştığını fark ettim. Örneğin div(olmadan <>) yazın , hemen sekmeye basın ve girer <div></div>. Tam olarak aynı değil ama işe yarayabilir. Bu kısayollar için Doco (emmet) burada
Peter

3
evet, bunun sebebi Emmet. Emmet, parantez olmadan eleman isimlerini yazalım ve gerekli olanı ekleyecektir. Gerçekten çok güçlü.
John Papa

1
Bu benim için VS Code 1.5.3'te çalışmıyor. <div> yazarsam </ etiketi kapatmıyor / tamamlamıyor. Burada eksik bir şey var mı?
Michael Giovanni Pumo

2
Sadece yazarak divolmadan <>ve daha sonra tab tuşuna basarak son güncellemeler sonrasında artık çalışmıyor. Bunu yeniden etkinleştirmenin bir yolu var mı?
Kokodoko

173

Etiket adını yazın (başlatmadan <) ve ardından Sekme tuşuna basın

örneğin yazın ve divardından sekme tuşuna basın ve VS bunu<div></div>

Veya açılış etiketini yazın ve ardından iki kez Sekme tuşuna basın

Örneğin :

  1. tip <div
  2. Tab'a basın
  3. Tab'a basın

kapanış etiketini ekleyecek


2
Peki ya kendi kendine kapanan etiketler (ör. <İnput />)?
Randall Flagg

1
sadece input yazın ve Sekme tuşuna iki kez basın, VS Code bunu otomatik olarak <input type = "text"> şeklinde tamamlayacaktır
Amit Mittal

1
Bunun, yalnızca etiket çiftlerini değil, daha karmaşık HTML yapısını kolayca oluşturmanıza olanak tanıyan Emmet işlevinin bir parçası olduğunu da eklemek isterim. Örnekler için okuyabilir bu , ya da sadece Emmet için google.
Alex Che

@Rabolf, VS Code için başka harika HMTL kısayollarından bahsedebilir misiniz?
eMad

@eMAD maalesef VS Kodunu kullanmaya devam etmedim
Rabolf

56

Aynı sorunu yaşıyordum, sonra sağ altta vs kodunun sağında bir şey gördüm .. HTML kullanmak yerine Django-HTML kullanıyordum, bu yüzden dili html olarak değiştirdim, Boom her şey tekrar iyi çalışıyor. resme bakın


Benzer bir sorun vardı, ancak benim durumumda bir PHP dosyasına HTML yazdığımı fark ettim. Olduğum sürece otomatik kapama etiketlerini kullanamayacağımı varsayalım.
Prometheus

1
dili değiştirmek gerekli değildir, yalnızca settings.json "emmet.includeLanguages": {"django-html": "html"}
raultedesco

Yukarıdaki @raultedesco yorumu sayesinde Twig şablonlarımı HTML'yi anlamsız olarak düzelttim. Ctrl+Shift+p-> aç Perferences: Open Settings (UI)-> ara includedLanguages-> Bulunan Emmet Dilleri -> giriş Item: twig; Value: html-> Add item-> keyfini çıkarın.
Valentine Shi

22

İşte harika bir numara (aslında bir Emmet kısaltması) :

  • etiket adını yazın | Örneğinh1
  • bundan sonra bir yıldız işareti ekleyin | Örneğinh1*
  • basın | (sonuçlanacak )Tab<h1></h1>

­

Not: Bu, - input, imgvb. Kendi kendine kapanan etiketler için de işe yarar .


1
@Kokodoko Evet yapar :P
ɢʀᴜɴᴛ

Bu çok tuhaf ..... Yeniden etkinleştirmek için hangi ayarı değiştireceğimi bilmiyorum ...
Kokodoko

1
@Kokodoko, emmet uzantısının yüklü olması gerekir.
Sudhanshu

1
Bu çalışır, ancak *. 1.21.0
Sauce

1
@BlueClouds evet ve html kısaltma desteği sağlayan herhangi biri çalışmalıdır. Genel bir kurala göre, maksimum yüklemeye sahip olanı kullanıyorum.
Sudhanshu

15

VS Code için bu uzantıyı deneyebilirsiniz . Otomatik kapanma etiketi işlevini uyguladı ve gereksinimlerinizi karşılayacak:

  • Açılış etiketinin kapanış ayracını yazdığınızda otomatik olarak kapanış etiketi ekleyin
  • Kapanış etiketi eklendikten sonra, imleç açılış ve kapanış etiketi arasındadır

İhtiyacım olan şey bu. Şimdi Brackets gibi çalışıyor, bu harika. Teşekkürler!
Harvey3589661

Evet ama ... VS Code'un önceki sürümlerinde etkinleştirildi. Bu sadece settings.json labirentinde bir yer değil mi?
Kokodoko

7

Bir HTML dosyasını düzenlerken VSCode (1.30.2) ile Mac Sierra'da (10.12.6) aynı sorunla karşılaştım. Vscode belgelerine göre https://code.visualstudio.com/docs/languages/html , intellisense kutunun dışında çalışmalıdır.

"Dil Algılama" nın (ekranın altındaki düzenleyici durum çubuğunun sağ köşesinde) Otomatik Algılama olarak ayarlandığı ve dosyayı olarak tanıdığı ortaya çıktı django-html. Manuel olarak düz Html'ye geri dönüldüğünde, her şey çalışır.


5
  1. Komut paletini açmak için Ctrl + Shift + P tuşlarına basın .
  2. Arama kutusuna 'Dil Modunu Değiştir' yazın.
  3. 'Dil Modunu Değiştir'i seçin .
  4. Arayıcıya 'HTML' yazın.
  5. Ve 'HTML'yi seçin (muhtemelen' django-html olarak ayarlanmıştır)

3

𝐜𝐭𝐫𝐥+𝐬𝐡𝐢𝐟𝐭+𝐏-> tuşuna basın 𝐂𝐡𝐚𝐧𝐠𝐞 𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞 𝐌𝐨𝐝𝐞 -> yazın ve ardından 𝐀𝐮𝐭𝐨 𝐃𝐞𝐭𝐞𝐜𝐭 öğesini seçin

Benim için çalışıyor.


1
Bu yanıtta yeni bir şey görmüyorum
Double Expresso

2

Dosya> Tercihler> Tuş Eşlemeleri, 'Otomatik kapat'ı arayın ve kur'a tıklayın. Çalışmazsa, eklentiyi yeniden yükleyin.


1

Aynı sorundan muzdariptim, sonra VS Code'dan gereksiz uzantıları JavaScript (SE) uzantısıyla birlikte kaldırdım ve benim için çalıştı.


0

Ctrl + Shift + PKomutu açmak için basın . Ardından Change Language Modebir seçim HTMLveya istediğiniz başka bir dili yazın.


0

Sadece vscode'unuzun altını kontrol edin ve dil modunu HTML olarak değiştirin Django-html gösteriyor olabilir veya dil modunu değiştirmek için ctrl + shift + p tuşlarına tıklayın Ekran Görüntüsü

Şimdi [!] + SEKME tıklayın tamamdır !!!


0

Eğer yazarsan

div.class

ve ardından TAB tuşuna basın , VS kodu DIV etiketini verilen CLASS ile otomatik olarak kapatır.

Ama bu işlemi ENTER tuşuna basarak yapmak istediğinizi düşünüyorum .

Bu durumda, VS Code kullanıcı ayarınıza gidin ve aşağıdaki kodu yapıştırın:

"emmet.includeLanguages": {
    "javascript": "javascriptreact",
    "vue-html": "html",
    "razor": "html",
    "plaintext": "jade"
}

Şimdi yazarsan

div.class

& sonra ENTER tuşuna basın , sihri görebilirsiniz.

Bununla birlikte, yukarıdaki kod, VS Kodunuzu yalnızca normal HTML için değil, aynı zamanda React JSX'i için de ENTER tuşu ile otomatik tamamlama yapacaktır , Vue.js kod parçacıkları da bunu kapsayacaktır.

Ancak bunu sadece HTML dosyası için yapmak istiyorsanız, sadece aşağıdaki satır yeterlidir:

"emmet.includeLanguages": { "javascript": "html" }

Şerefe ..

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.