Di mana kode kelas css di visual studio?

Ekstensi ini secara otomatis mengubah kelas CSS menjadi sintaks Modul CSS

Untuk mengaktifkan ekstensi secara manual, tekan Ctrl+Shift+P dan pilih Transform classes into CSS module syntax;

Masalah Dikenal

• Mengonversi secara otomatis saat menyimpan hanya berfungsi jika Anda telah mengonversinya secara manual minimal satu kali

Instalasi

• Instal melalui pasar Visual Studio Code
• Unduh dan instal paket vsix_ dari Rilis Github

Menyumbang

Berkontribusi di Github

Ekstensi ini memperluas pengeditan kode HTML dan ejs dengan dukungan Go To Definition dan Go To Symbol in Workspace untuk css/scss/less (kelas dan ID) yang ditemukan dalam string di dalam kode sumber

Ini sangat terinspirasi oleh fitur serupa di Brackets yang disebut CSS Inline Editors

Ekstensi mendukung semua kemampuan normal pelacakan definisi simbol, tetapi apakah itu untuk pemilih css (kelas, ID, dan tag HTML). Ini termasuk

• Mengintip. muat file css sebaris dan lakukan pengeditan cepat di sana. (Ctrl+Shift+F12)
• Pergi ke. lompat langsung ke file css atau buka di editor baru (F12)
• Arahkan. tampilkan definisi dengan mengarahkan kursor ke simbol (Ctrl+hover)

Selain itu, ini mendukung Penyedia Simbol sehingga Anda dapat dengan cepat beralih ke kode CSS/SCSS/KURANG yang tepat jika Anda sudah mengetahui nama kelas atau ID

Mengizinkan Pergi ke Definisi dari HTML ke CSS / Sass / Kurang, menyediakan Simbol Penyelesaian dan Ruang Kerja untuk nama kelas & id, dan mendukung Temukan Referensi dari CSS ke HTML

Fitur

Pergi ke Definition dan Peek Definition

Dalam dokumen HTML, pilih Go to definition_ atau Peek definition, ekstensi akan mencari pemilih CSS & Scss & Kurang terkait di folder ruang kerja saat ini. Dapat juga mencari pemilih dalam referensi bersarang &... untuk Sass & Less

Tempat Anda dapat menemukan definisi

• HTML (or files whose extension specified by activeHTMLFileExtensions option): <html-tag>, class="class-name", id="id-name".
• BEJ dan TSX. namakelas="class-name", namakelas={"class-name"}
• Dokumen seperti CSS. Go to definition0, Go to definition1, Go to definition2

Perhatikan bahwa template JSX tidak memberikan penyelesaian untuk nilai atribut secara default, Anda dapat memicunya secara manual dengan mengklik Go to definition3, atau mengubah pengaturan

editor.quickSuggestions": {
    "other": true,
    "comments": false,
    "strings": false
},

Simbol ruang kerja

Memungkinkan untuk mencari simbol ruang kerja di file CSS & Scss & Kurang di semua folder ruang kerja yang diaktifkan

Penyelesaian Nama Kelas dan ID

Memberikan nama kelas dan penyelesaian id untuk file HTML Anda

Perhatikan bahwa ekstensi tidak mendukung sumber jarak jauh, dan tidak mengikuti Go to definition4 tag di file HTML Anda untuk membatasi hasil penyelesaian, itu hanya mencantumkan semua nama kelas & id yang ditentukan di file CSS & Scss & Less di folder ruang kerja Anda

Temukan Semua Referensi dan Intip Referensi

Mendukung pencarian referensi pemilih CSS di file HTML Anda

Fungsionalitas ini seharusnya tidak terlalu berguna, dan perlu memuat dan mem-parsing semua file yang dikonfigurasi di activeHTMLFileExtensions sebagai tambahan. tetapi jika Anda suka memeriksa dan memfaktorkan ulang kode CSS, setidaknya itu jauh lebih baik daripada mencarinya di folder

Bagaimana cara menemukan kelas CSS dalam kode Visual Studio?

Bagaimana cara membuat kode kelas di CSS?