Bagaimanakah vscode menjalankan kod html_Bagaimana vscode menjalankan kod html-html tutorial-php.cn

Bagaimana untuk menjalankan kod html dalam vscode

百草

Lepaskan： 2024-03-25 15:37:41

asal

730 orang telah melayarinya

Menjalankan kod HTML dalam Visual Studio Code (VSCode) adalah sangat mudah kerana HTML pada asasnya ialah bahasa penanda statik yang boleh dihuraikan dan dipaparkan terus dalam penyemak imbas. Artikel ini memperincikan langkah untuk menjalankan dan pratonton kod HTML dalam VSCode, termasuk memasang VSCode, mencipta fail HTML, menulis atau mengedit kod HTML, pratonton halaman HTML dan menyahpepijat kod JavaScript.

Bagaimana untuk menjalankan kod html dalam vscode

Menjalankan kod HTML dalam Visual Studio Code (VSCode) adalah agak mudah kerana HTML pada asasnya ialah bahasa penanda statik yang boleh dihuraikan dan dipaparkan terus dalam penyemak imbas. Walau bagaimanapun, apabila anda menyebut "kod berjalan", saya menganggap anda merujuk kepada pratonton atau penyahpepijatan halaman HTML, dan mungkin JavaScript dan CSS yang dikaitkan dengannya. Berikut ialah langkah terperinci tentang cara menjalankan dan pratonton kod HTML dalam VSCode:

Langkah 1: Pasang Kod Visual Studio

Pertama, pastikan anda memasang versi terkini VSCode. Anda boleh memuat turun dan memasangnya dari laman web rasmi VSCode (https://code.visualstudio.com/download).

Langkah 2: Buat atau buka fail HTML

Anda boleh mencipta fail HTML baharu atau membuka fail HTML sedia ada dalam VSCode. Anda boleh mencipta fail baharu dengan mengklik ikon Fail Baharu di bar sisi atau menggunakan pintasan Ctrl + N (Windows/Linux) atau Cmd + N (Mac). Kemudian, apabila anda menyimpan fail, pastikan ia mempunyai sambungan .html, seperti index.html.

Langkah 3: Tulis atau edit kod HTML

Dalam fail HTML yang dibuka, anda boleh mula menulis atau mengedit kod HTML. Halaman HTML ringkas mungkin kelihatan seperti ini:

<!DOCTYPE html>  
<html>  
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport" content="width=device-width, initial-scale=1.0">  
    <title>我的第一个 HTML 页面</title>  
</head>  
<body>  
    <h1>欢迎来到我的网站</h1>  
    <p>这是一个简单的 HTML 页面示例。</p>  
</body>  
</html>

Salin selepas log masuk

Pastikan kod anda lengkap dan tiada ralat sintaks. Ciri penyerlahan sintaks terbina dalam VSCode boleh membantu anda mengenal pasti ralat dalam kod anda.

Langkah 4: Pratonton halaman HTML

VSCode menyediakan beberapa kaedah untuk pratonton halaman HTML:

Kaedah 1: Gunakan pratonton penyemak imbas terbina dalam

Pratonton VSCode mempunyai fungsi terbina dalam boleh Klik butang "Go Live" di penjuru kanan sebelah atas editor atau gunakan pintasan Alt + B (Windows/Linux) atau Shift + Cmd + P dan taip Pelayan Langsung: Buka dengan Pelayan Langsung (Mac) untuk memulakan tempatan pelayan dan pratonton halaman anda. Ini memerlukan pemalam yang dipanggil "Pelayan Langsung", jika anda belum memasangnya lagi, ikuti langkah berikut:

Buka kedai sambungan VSCode (dengan mengklik ikon segi empat sama pada bar sisi atau menekan Ctrl + Shift + X / Cmd +Shift+ X).

Masukkan "Pelayan Langsung" dalam kotak carian.

Cari pemalam "Pelayan Langsung" daripada hasil carian dan klik butang "Pasang".

Selepas pemasangan selesai, anda boleh memulakan Pelayan Langsung dan pratonton halaman HTML anda melalui kaedah di atas. Pelayan Langsung secara automatik menyegarkan penyemak imbas anda apabila anda menyimpan fail, membolehkan anda melihat kesan perubahan kod anda dalam masa nyata.

Kaedah 2: Buka dalam penyemak imbas luaran

Cara lain untuk pratonton halaman HTML ialah membuka fail terus dalam penyemak imbas luaran. Anda boleh membuka fail dengan mengklik kanan pada fail HTML dalam editor dan memilih "Buka dalam penyemak imbas" atau menggunakan pintasan Ctrl + Klik (Windows/Linux) atau Cmd + Klik (Mac). VSCode akan cuba membuka fail menggunakan penyemak imbas lalai anda. Walau bagaimanapun, sila ambil perhatian bahawa pendekatan ini mungkin tidak memuatkan fail CSS atau JavaScript yang berkaitan, terutamanya jika ia dirujuk melalui laluan relatif.

Langkah 5: Nyahpepijat kod JavaScript (pilihan)

Jika halaman HTML anda mengandungi kod JavaScript dan anda ingin menyahpepijat kod, anda boleh menggunakan penyahpepijat terbina dalam VSCode. Mula-mula, anda perlu menyediakan fail konfigurasi launch.json dalam projek anda untuk menentukan persekitaran penyahpepijatan. VSCode menyediakan wizard untuk mencipta fail ini. Biasanya, anda memulakan proses ini dengan mengklik ikon Jalankan & Nyahpepijat pada bar sisi (atau menggunakan pintasan Ctrl + Shift + D / Cmd + Shift + D) dan kemudian mengklik "Buat fail launch.json." Pilih "Chrome" atau penyemak imbas lain yang anda gunakan sebagai sasaran nyahpepijat dan konfigurasikan pilihan yang sesuai. Anda kemudiannya boleh menetapkan titik putus dalam kod JavaScript anda dan memulakan sesi penyahpepijatan untuk melangkah melalui kod tersebut.

Ringkasan

Menjalankan kod HTML dalam VSCode terutamanya melibatkan penulisan dan pratonton halaman HTML. Walaupun HTML itu sendiri tidak perlu disusun atau dilaksanakan, adalah mudah untuk melihat pemaparan halaman menggunakan Pelayan Langsung atau membuka fail terus dalam penyemak imbas. Untuk halaman kompleks yang mengandungi JavaScript, fungsi nyahpepijat VSCode boleh membantu anda menyahpepijat kod. Dengan menggunakan ciri dan pemalam VSCode dengan betul, anda boleh membangunkan projek HTML dengan lebih cekap.

Atas ialah kandungan terperinci Bagaimana untuk menjalankan kod html dalam vscode. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!