Trong Sublime Text, làm thế nào để bạn viết mã ngắn?

9

Tôi xin lỗi nhưng tôi không biết nó được gọi là gì, nếu điều này đã được hỏi hoặc trang web Stack nào phù hợp nhất. Tôi đã xem một số video về cách mọi người sử dụng Sublime để tạo các thẻ nhanh hơn và tôi muốn tìm hiểu cách thức phù hợp để làm điều này nếu có bất kỳ tài liệu nào hoặc những gì tôi có thể làm nhanh hơn trong mã hóa của mình.

Trong một số video tôi thấy mọi người làm những việc như:

div.classvà nó sẽ tạo ra <div class="class"></div>sau tab.

sublime-text-2

— DVᴀᴅᴇʀ
nguồn

Bạn cũng có thể tạo các đoạn tùy chỉnh của riêng bạn; docs.sublimetext.info/en/latest/extensibility/snippets.html

— Abdessamad Idrissi

Các liên kết trên không còn hiệu lực. Có một liên kết chính thức nào nêu cách tạo các đoạn tùy chỉnh của riêng chúng tôi không?

— anjanesh

11

Tính năng bạn mô tả là một phần của Sublime Text 2 ngoài hộp. Đảm bảo tài liệu của bạn sử dụng cú pháp HTML ( Xem »Cú pháp» HTML ).

Nhập foo.bar, nhấn Tabvà bạn sẽ nhận được <foo class="bar"></foo>. Cũng có foo#bar( idthay vì class). Cả hai đều được thực hiện trong .Packages/HTML/html_completions.py

— Daniel Beck
nguồn

Có tài liệu nào về cách xây dựng athẻ và một cái gì đó giống như lithẻ không? Đây có phải chỉ dành cho HTML? và +1.

— DVᴀᴅᴇʀ

@Gramp Không chắc ý của bạn là gì, nhưng lưu ý rằng tôi đã chỉ ra tập lệnh nơi tính năng này được triển khai (chọn mục trình đơn Duyệt Gói Gói để đi đến thư mục tôi đề cập). Ví dụ, bạn có thể mở rộng tập lệnh hiện có để hỗ trợ ví dụ: dấu phân cách bổ sung. Các tập lệnh Sublime Text 2 được triển khai bằng Python, đây là tài liệu Python và trang này chứa tài liệu dành riêng cho Sublime Text 2.

— Daniel Beck

Tôi đã thấy ai đó làm div#main.containernhưng Sublime phun ra một mainyếu tố với một lớp containerkhi tôi thử?

— taco

7

Mã hóa / Zen

Emmet là một plugin nơi bạn viết cấu trúc cơ bản theo cách giống như bộ chọn CSS và có trình soạn thảo mở rộng nó. Bạn có thể tìm thấy gói trên GitHub và cài đặt nó thông qua Trình quản lý gói.

_{(nguồn: smashingmagazine.com )}

Tạp chí Smashing này có một bài viết về nó . Ví dụ,

(.foo>h1)+(.bar>h2)

sẽ mở rộng với Tabtới

<div class="foo">
  <h1></h1>
</div>
<div class="bar">
  <h2></h2>
</div>

Lựa chọn gói trong Thẻ

Những gì bạn cũng có thể làm là nhấn AltShiftWđể tạo thẻ mở hoặc bọc lựa chọn hiện tại trong thẻ (xem Chỉnh sửa »Thẻ» Bọc lựa chọn hiện tại trong Thẻ ).

Theo mặc định, nó sẽ tạo:

<p></p>

với tên thẻ được chọn để bạn có thể ghi đè lên nó.

Nhấn Tabsẽ tiếp tục đưa bạn vào trong thẻ. Hoặc, nếu bạn nhấn Space, bạn có thể tạo các thuộc tính, ví dụ:

AltShiftW(trên Windows / Linux) hoặc CtrlShiftWtrên OS X
A
Space
Gõ href="...", rồiTab
Kết quả <a href="..."></a>với con trỏ được định vị bên trong thẻ

— slhck
nguồn