Home » BELAJAR LARAVEL » Cara ingin shortcut keyboard di VS Code yang bisa otomatis menghasilkan struktur dasar HTML

Syahril Safarosidi 7:22 AM BELAJAR LARAVEL Edit

Cara ingin shortcut keyboard di VS Code yang bisa otomatis menghasilkan struktur dasar HTML

Langkah-langkah Mengaktifkan Auto HTML (Emmet) di File Blade

1. Buka Settings JSON

Tekan:


Ctrl + Shift + P

Ketik:


Preferences: Open Settings (JSON)

Lalu tekan Enter.

2. Tambahkan Konfigurasi Berikut

Tempel baris ini di dalam settings.json kamu (jika belum ada, tambahkan di akhir tanda { ... }):


"emmet.includeLanguages": {
    "blade": "html",
    "php": "html"
},
"emmet.triggerExpansionOnTab": true

💡 Artinya:

blade dan php akan diperlakukan seperti file HTML oleh Emmet.
Kamu bisa pakai ! → Tab untuk generate template HTML otomatis.

3. Simpan dan Coba Lagi

Sekarang:

Kembali ke file welcome.blade.php
Ketik:
```
!
```

Tekan Tab
👉 Hasilnya langsung muncul struktur HTML lengkap seperti:


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  
</body>
</html>

ARRASYIDI

Cara ingin shortcut keyboard di VS Code yang bisa otomatis menghasilkan struktur dasar HTML

Langkah-langkah Mengaktifkan Auto HTML (Emmet) di File Blade

1. Buka Settings JSON

2. Tambahkan Konfigurasi Berikut

3. Simpan dan Coba Lagi

0 Response to "Cara ingin shortcut keyboard di VS Code yang bisa otomatis menghasilkan struktur dasar HTML "

Post a Comment