Rumah  >  Artikel  >  alat pembangunan  >  Bagaimana untuk menjana kod secara automatik dalam sublime

Bagaimana untuk menjana kod secara automatik dalam sublime

下次还敢
下次还敢asal
2024-04-03 14:57:23758semak imbas

Cara menjana kod secara automatik dalam Teks Sublime: Pasang pengurus pakej Emmet. Dayakan Emmet dan simpan fail tetapan. Gunakan pintasan Emmet untuk menjana kod secara automatik: taip nama elemen + Tab untuk mengembangkan elemen. Gunakan elemen induk untuk membalut elemen anak untuk mencipta elemen bersarang. Menambah pasangan atribut selepas nama elemen menghasilkan elemen atribut.

Bagaimana untuk menjana kod secara automatik dalam sublime

Cara menjana kod secara automatik dalam Sublime Text

Sublime Text ialah editor kod popular yang menyediakan satu siri ciri untuk meningkatkan kecekapan pembangunan, termasuk penjanaan kod automatik.

Kaedah:

  1. Pasang pengurus pakej Emmet:

    • Dalam Teks Sublime, gunakan kekunci pintasan Ctrl + >Shift> + <code>>Shift> (Windows) atau Cmd + Shift + P (Mac) untuk membuka palet arahan. Ctrl + Shift + P(Windows)或 Cmd + Shift + P(Mac),打开命令面板。
    • 输入 Package Control: Install Package 并回车。
    • 在搜索栏中输入 Emmet,找到相关包并安装。
  2. 启用 Emmet:

    • 打开 Sublime Text 的首选项文件:首选项 > 设置
    • 添加以下行:

      <code>{
        "auto_close_tags": true,
        "auto_complete_triggers": [
          {
            "selector": "*",
            "characters": [
              " ",
              ">",
            ]
          }
        ]
      }</code>
    • 保存设置文件。
  3. 使用 Emmet 快捷方式:

    • 要自动生成 HTML 元素,请键入元素名称,然后按 Tab 键。例如,输入 div 并按 Tab 会展开为 <div></div>
    • 要生成嵌套元素,请使用父级元素包裹子级元素。例如,输入 div>ul 并按 Tab 会展开为 <div><ul></ul></div>
    • 要生成具有属性的元素,请在元素名称后添加属性对。例如,输入 div[id=container] 并按 Tab 会展开为 <div id="container"></div>

示例:

以下是使用 Emmet 自动生成代码的一些示例:

  • 输入 ! 并按 Tab 会展开为 HTML5 文档。
  • 输入 nav#main 并按 Tab 会展开为 <nav id="main"></nav>
  • 输入 ul>li*5 并按 Tab 会展开为 <ul><li></li><li></li><li></li><li></li><li></li></ul>
  • Masukkan Kawalan Pakej: Pasang Pakej dan tekan Enter.

Masukkan Emmet dalam bar carian, cari pakej yang berkaitan dan pasangkannya.

🎜🎜🎜🎜🎜Dayakan Emmet: 🎜🎜🎜🎜Buka fail pilihan Sublime Text: Keutamaan > 🎜🎜🎜Tambah baris berikut: 🎜rrreee🎜🎜Simpan fail tetapan. 🎜🎜🎜🎜🎜🎜Gunakan pintasan Emmet: 🎜🎜🎜🎜Untuk menjana elemen HTML secara automatik, taipkan nama elemen dan tekan kekunci Tab. Contohnya, menaip div dan menekan Tab akan berkembang kepada <div></div>. 🎜🎜Untuk menjana elemen bersarang, balut elemen anak dengan elemen induk. Contohnya, menaip div>ul dan menekan Tab akan berkembang kepada <div><ul></ul></div> kod >. 🎜🎜Untuk menjana elemen dengan atribut, tambahkan pasangan atribut selepas nama elemen. Contohnya, menaip div[id=container] dan menekan Tab akan berkembang kepada <div id="container"></div> kod >. 🎜🎜🎜🎜🎜Contoh: 🎜🎜🎜Berikut adalah beberapa contoh penggunaan Emmet untuk menjana kod secara automatik: 🎜🎜🎜Masukkan ! dan tekan Tab dan ia akan berkembang kepada dokumen HTML5. 🎜🎜Masukkan nav#main dan tekan Tab untuk mengembangkan ke <nav id="main"></nav>. 🎜🎜Masukkan ul>li*5 dan tekan Tab, ia akan berkembang menjadi <ul><li></li><li> < /li><li></li><li></li><li></li></ul>. 🎜🎜🎜Emmet menyediakan pelbagai pintasan untuk menjana elemen, atribut dan struktur yang berbeza. Lihat dokumentasi Emmet untuk senarai lengkap. 🎜

Atas ialah kandungan terperinci Bagaimana untuk menjana kod secara automatik dalam sublime. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn